{"id":72693,"date":"2024-08-30T21:00:30","date_gmt":"2024-08-30T13:00:30","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=72693"},"modified":"2024-08-29T14:45:53","modified_gmt":"2024-08-29T06:45:53","slug":"designers-developers-monthly-08-2024","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (August 2024)"},"content":{"rendered":"<p>August 2024 brings us a collection of new tools, libraries, and resources to help you <a href=\"https:\/\/www.hongkiat.com\/blog\/website-and-page-building-tools\/\">build better websites<\/a> and applications, and <a href=\"https:\/\/www.hongkiat.com\/blog\/how-to-boost-productivity\/\">improve your productivity<\/a> as designers and developers. We\u2019ve got everything from design inspiration to development tools, and everything in between.<\/p>\n<p>Let\u2019s explore and see what\u2019s new this month.<\/p>\n<h2><a href=\"https:\/\/e18e.dev\/\" target=\"_blank\" rel=\"noopener\">e18e<\/a><\/h2>\n<p><strong>e18e<\/strong> is a community-driven initiative focused on improving the JavaScript ecosystem. It aims to bring together people who are passionate about JavaScript by sharing knowledge, contributing ideas, and collaborating.<\/p>\n<p>It has three key areas of focus: cleaning up and modernizing dependency trees, speeding up core packages and frameworks, and offering modern, lighter alternatives to core packages.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg\" alt=\"e18e JavaScript ecosystem community initiative\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.freefaces.gallery\/\" target=\"_blank\" rel=\"noopener\">FreeFaces Gallery<\/a><\/h2>\n<p><strong>FreeFaces Gallery<\/strong> is a curated collection of fonts available under various free licenses. It provides a range of typefaces, including <a href=\"https:\/\/www.hongkiat.com\/blog\/cursive-fonts\/\">Cursive<\/a>, Display, <a href=\"https:\/\/www.hongkiat.com\/blog\/monospaced-fonts\/\">Monospace<\/a>, <a href=\"https:\/\/www.hongkiat.com\/blog\/sans-serif-fonts\/\">Sans Serif<\/a>, Serif, and Slab.<\/p>\n<p>It\u2019s a valuable resource if you\u2019re searching for <a href=\"https:\/\/www.hongkiat.com\/blog\/42-high-quality-fonts-for-professional-web-design\/\">high quality free fonts<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/freefaces.jpg\" alt=\"FreeFaces Gallery font collection\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/appmotion.design\/\" target=\"_blank\" rel=\"noopener nofollow\">AppMotion Design<\/a><\/h2>\n<p><strong>AppMotion<\/strong> is a mobile motion design gallery that showcases the best, hand-picked examples of app motion design. The gallery allows you to explore various design elements, such as checkboxes, pinch, spin, morph, and more.<\/p>\n<p>A useful resource if you\u2019re looking for inspiration in mobile app animations.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/appmotion-design.jpg\" alt=\"AppMotion mobile motion design gallery\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/logoipsum.com\/\" target=\"_blank\" rel=\"noopener\">LogoIpsum<\/a><\/h2>\n<p><strong>LogoIpsum<\/strong> is a tool that provides a collection of abstract, flexible <a href=\"https:\/\/www.hongkiat.com\/blog\/free-svg-files\/\">SVG logos<\/a> in various compositions-vertical, horizontal, small, and large. These logos are suitable for any graphic, UI, or layout style.<\/p>\n<p>It\u2019s a perfect resource for designers needing temporary placeholder logos before the final design is ready.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/logoipsum.jpg\" alt=\"LogoIpsum SVG logo collection\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.shadergradient.co\/\" target=\"_blank\" rel=\"noopener\">ShaderGradient<\/a><\/h2>\n<p><strong>ShaderGradient<\/strong> is a tool for creating dynamic, moving gradients that can be customized for various designs. It\u2019s available as a React component and can be used in design tools like Figma and Framer.<\/p>\n<p>A handy tool to bring your designs to life with vibrant gradients.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/shader-gradient.jpg\" alt=\"ShaderGradient moving gradients tool\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/shots.so\/\" target=\"_blank\" rel=\"noopener\">Shots<\/a><\/h2>\n<p><strong>Shots.so<\/strong> is a free online tool that helps you create beautiful mockups quickly. Simply upload your screenshot, select from scenes with the latest Apple devices, and customize the details.<\/p>\n<p>It also offers browser, laptop, and mobile scenes to highlight your work.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/shots.jpg\" alt=\"Shots.so mockup creation tool\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/sneakpeekit.com\/\" target=\"_blank\" rel=\"noopener\">SneakPeekit<\/a><\/h2>\n<p><strong>SneakPeekit<\/strong> provides printable <a href=\"https:\/\/www.hongkiat.com\/blog\/wireframing-prototyping-tools\/\">wireframe templates<\/a> for designers to sketch ideas and capture insights on paper. It offers various sizes for both desktop and mobile.<\/p>\n<p>If you prefer planning apps or websites with <a href=\"https:\/\/www.hongkiat.com\/blog\/advantages-pen-paper-computer-design\/\">pencil and paper<\/a>, these templates help speed up the creative process.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/sneakpeekit.jpg\" alt=\"SneakPeekit wireframe templates\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.svgmagic.dev\/\" target=\"_blank\" rel=\"noopener nofollow\">SVGMagic<\/a><\/h2>\n<p><strong>SVGMagic<\/strong> is an open-source package for Next.js projects that simplifies the use of SVGs. It supports both SVG code and <code>.svg<\/code> files with seamless integration with TypeScript and MDX.<\/p>\n<p>It makes it easy to deliver your creativity in SVG while also improving your development workflow.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/svgmagic.jpg\" alt=\"SVGMagic SVG management package\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/giscus.app\/\" target=\"_blank\" rel=\"noopener\">Giscus<\/a><\/h2>\n<p><strong>Giscus<\/strong> is an open-source comment system for websites that uses <a href=\"https:\/\/docs.github.com\/en\/discussions\" target=\"_blank\" rel=\"noopener noreferrer\">GitHub Discussions<\/a> for storing comments and reactions. It offers privacy with no tracking or ads and will always be free.<\/p>\n<p>It also supports custom themes, multiple languages, and automatic updates from GitHub. It is a flexible and secure choice if you\u2019re looking to add a comment system to your site.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/giscus.jpg\" alt=\"Giscus GitHub-based comment system\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/m1guelpf\/orbit\" target=\"_blank\" rel=\"noopener\">Orbit<\/a><\/h2>\n<p><strong>Orbit<\/strong> is a GitHub Action specifically designed for a <a href=\"https:\/\/www.hongkiat.com\/blog\/laravel-development-environment-comparison\/\">Laravel development environment,<\/a> enabling simple and safe zero-downtime deployments. It offers an easy way to configure your deployment process through a special file, <code>Orbit.toml<\/code>.<\/p>\n<p>This allows you to deploy your Laravel sites to your server quickly while ensuring that your site remains live throughout the process.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/orbit.jpg\" alt=\"Orbit Laravel zero-downtime deployment\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/glaze.dev\/\" target=\"_blank\" rel=\"noopener\">Glaze<\/a><\/h2>\n<p><strong>Glaze<\/strong> is a utility-based animation library for the web, built on top of GSAP. It provides a powerful way to create complex animations with minimal code using a utility-first approach like <a href=\"https:\/\/www.hongkiat.com\/blog\/tailwind-css\/\">TailwindCSS<\/a>.<\/p>\n<p>It supports responsive design and allows you to easily define animations for different screen sizes. A handy tool for adding dynamic animations to your web projects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/glaze.jpg\" alt=\"Glaze GSAP-based animation library\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/motion-number.barvian.me\/\" target=\"_blank\" rel=\"noopener\">Motion Number<\/a><\/h2>\n<p><strong>MotionNumber<\/strong> is a React.js component built on top of <a href=\"https:\/\/www.framer.com\/motion\/\" target=\"_blank\" rel=\"noopener noreferrer\">Framer Motion<\/a>, designed to smoothly transition, format, and localize numbers.<\/p>\n<p>It\u2019s a handy library to create dynamic and visually appealing number animations in your projects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/motion-number.jpg\" alt=\"MotionNumber React.js number animation component\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.zen-browser.app\/\" target=\"_blank\" rel=\"noopener\">Zen Browser<\/a><\/h2>\n<p><strong>Zen<\/strong> is a new browser built on Firefox\u2019s engine. It aims to provide a fast, secure, and <a href=\"https:\/\/www.hongkiat.com\/blog\/private-browsers-windows-11\/\">privacy-focused web browsing<\/a> experience.<\/p>\n<p>This browser is designed to ensure your data remains private and secure. A good choice if you\u2019re looking for an alternative browser that respects your privacy.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/zen.jpg\" alt=\"Zen privacy-focused web browser\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/sindresorhus\/ky\" target=\"_blank\" rel=\"noopener\">Ky<\/a><\/h2>\n<p><strong>Ky<\/strong> is a lightweight library for modern environments. It aims at improving the native <code>fetch<\/code> API with a simpler interface, method shortcuts, error handling, retries, and JSON support.<\/p>\n<p>It also offers customization through instances and hooks and includes TypeScript support for better type safety. It\u2019s a great alternative for handling HTTP requests in your projects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/ky.jpg\" alt=\"Ky lightweight fetch API library\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.youtube.com\/watch?v=wEM5NdJ-8HY\" target=\"_blank\" rel=\"noopener nofollow\">TailwindCSS Course<\/a><\/h2>\n<p>This free YouTube course by Chris Sev will help you <a href=\"https:\/\/www.hongkiat.com\/blog\/tailwind-css\/\">learn TailwindCSS<\/a>. Alongside learning Tailwind, it also covers essential CSS concepts.<\/p>\n<p>This course is a comprehensive guide if you\u2019re looking to both master TailwindCSS and understand the fundamentals of <a href=\"https:\/\/www.hongkiat.com\/blog\/20-useful-css-tips-for-beginners\/\">design with CSS<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/tailwind-course.jpg\" alt=\"TailwindCSS YouTube course by Chris Sev\" width=\"750\" height=\"431\"><\/figure>\n<h2><a href=\"https:\/\/devdojo.com\/pines\" target=\"_blank\" rel=\"noopener\">Pines<\/a><\/h2>\n<p><strong>Pines<\/strong> is a UI library designed for Alpine and Tailwind projects. It provides a collection of <a href=\"https:\/\/www.hongkiat.com\/blog\/css3-animation-tools\/\">ready-to-use animations<\/a>, and components like sliders, tooltips, accordions, modals, and more.<\/p>\n<p>It also allows you to easily copy and paste these elements into your projects. A convenient resource if you want to quickly add interactive elements to your site.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/pines.jpg\" alt=\"Pines UI library for Alpine and Tailwind\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/MyIntervals\/PHP-CSS-Parser\" target=\"_blank\" rel=\"noopener\">PHP CSS Parser<\/a><\/h2>\n<p><strong>PHP-CSS-Parser<\/strong> is a PHP library that parses CSS files, allowing you to extract them into a data structure. It allows you to manipulate the CSS and then output it as optimized CSS.<\/p>\n<p>A very useful library if you need to work with and modify CSS programmatically in your PHP application.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/php-css-parser.jpg\" alt=\"PHP-CSS-Parser PHP library for CSS\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/noodle-run\/noodle\" target=\"_blank\" rel=\"noopener\">Noodle<\/a><\/h2>\n<p><strong>Noodle<\/strong> is an open-source app created to help students stay organized with their studies. It is designed to provide a single platform that meets all the needs of students, much like GitHub does for developers.<\/p>\n<p>At the time of this writing, Noodle is currently in development, but you can follow the project on GitHub to stay updated on its progress.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/noodle-run.jpg\" alt=\"Noodle open-source student organization app\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/Tencent\/omi\" target=\"_blank\" rel=\"noopener\">Omi<\/a><\/h2>\n<p><strong>Omi<\/strong> is a web components framework. It provides a wide range of features with over 100 templates, form components, and icon sets, with support for both object-oriented and data-oriented programming.<\/p>\n<p>It is written in JSX, integrates seamlessly with modern tools like TailwindCSS, and provides everything you need for building web applications, including routing and styling through Constructable Stylesheets.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/omi.jpg\" alt=\"Omi web components framework\" width=\"750\" height=\"480\"><\/figure>","protected":false},"excerpt":{"rendered":"<p>August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your productivity as designers and developers. We\u2019ve got everything from design inspiration to development tools, and everything in between. Let\u2019s explore and see what\u2019s new this month. e18e e18e is a community-driven initiative&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[352],"tags":[2539],"topic":[],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.8) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Fresh Resources for Web Designers and Developers (August 2024) - Hongkiat<\/title>\n<meta name=\"description\" content=\"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fresh Resources for Web Designers and Developers (August 2024)\" \/>\n<meta property=\"og:description\" content=\"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2024-08-30T13:00:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (August 2024)\",\"datePublished\":\"2024-08-30T13:00:30+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/\"},\"wordCount\":1034,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-08-2024\\\/e18e.jpg\",\"keywords\":[\"Tools for Designers &amp; Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (August 2024) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-08-2024\\\/e18e.jpg\",\"datePublished\":\"2024-08-30T13:00:30+00:00\",\"description\":\"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-08-2024\\\/e18e.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-08-2024\\\/e18e.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-08-2024\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fresh Resources for Web Designers and Developers (August 2024)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Fresh Resources for Web Designers and Developers (August 2024) - Hongkiat","description":"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (August 2024)","og_description":"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2024-08-30T13:00:30+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (August 2024)","datePublished":"2024-08-30T13:00:30+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/"},"wordCount":1034,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg","keywords":["Tools for Designers &amp; Developers"],"articleSection":["Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/","name":"Fresh Resources for Web Designers and Developers (August 2024) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg","datePublished":"2024-08-30T13:00:30+00:00","description":"August 2024 brings us a collection of new tools, libraries, and resources to help you build better websites and applications, and improve your","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-08-2024\/e18e.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-08-2024\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Fresh Resources for Web Designers and Developers (August 2024)"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-iUt","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72693","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=72693"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72693\/revisions"}],"predecessor-version":[{"id":72696,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72693\/revisions\/72696"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=72693"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=72693"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=72693"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=72693"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}