Discover the best new resources for web developers and designers including tools, libraries, fonts, icons and many other goodies that we curated during May 2018.
1. Tools & Utilities
![Overflow](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_overflow.jpg)
Overflow
Overflow is a new cross-platform tool that syncs with other design tools that you can use to create beautiful user flows.
![Screely](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_screenly.jpg)
Screely
Screely makes your screenshots or designs beautiful and Dribbble-ready with just a drag and drop.
![Unique](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_unique.jpg)
Unique
Unique allows you to create your own custom fonts in just a few steps.
![Illustration Tools - Directory of tools for illustrators](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_illustration_tools.jpg)
Illustration Tools
Illustration Tools is as its name says, a nifty directory of tools for illustrators that’s worth checking out!
![LayoutIt](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_layoutit.jpg)
LayoutIt
LayoutIt is a CSS grid layout generator.
![Jumprock](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_jumprock.jpg)
Jumprock
Jumprock is a service that handles form submissions for your static websites.
![Keyframes.app](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_keyframes.jpg)
Keyframes.app
Keyframes.app comes as a browser extension and a web app with a visual timeline that allows you to easily create and run animations.
![Cool Backgrounds](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_cool_backgrounds.jpg)
Cool Backgrounds
Cool backgrounds is an awesome background generator.
2. Libraries
![ReLaXed](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_relaxed.jpg)
ReLaXed
ReLaXed is a library that allows complex layouts to be created using web technologies and generates PDF documents interactively.
![Cash.js](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_cash.jpg)
Cash.js
Cash is a really small (4kb mingz) jQuery alternative for modern browsers (IE10+).
![Curtains.js](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_curtainsjs.jpg)
Curtains.js
Curtains.js is a small library that converts HTML elements into animated 3D WebGL textured planes.
![Layer.js](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_layerjs.jpg)
Layer.js
Layer.js is a library that allows you to create UI compositions and animations.
![Smart CSS Grid](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_smart_css_grid.jpg)
Smart CSS Grid
Smart CSS Grid is a lightweight CSS framework with clear syntax and minimal footprint weighing only 0.5 KB.
![Flexy](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_flexy.jpg)
Flexy
Flexy is a minimalistic CSS framework weighing only 0.33 KB minified and gzipped.
![Ranger.js](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_rangerjs.jpg)
Ranger.js
Ranger.js is a small, standalone library for working with ranges of numbers in JavaScript.
![Saber.js](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_saberjs.jpg)
Saber.js
Saber.js is a lightweight library for creating static websites using Vue.
3.Courses & Tutorials
![Scrimba - Learn Bulma CSS for Free](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_scrimba_bulma.jpg)
Learn Bulma CSS
Build three beautiful websites in less than 1 hour with the Bulma CSS course from Scrimba.
![CSS Tricks - Responsive Knockout Text With Looping Video](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_csstricks_responsive_knockout_text.jpg)
Responsive Knockout Text With Looping Video
Giulio Mainardi wrote a great article on CSS Tricks on how to create a responsive knockout text with looping background video.
![CSS Tricks - Solved with CSS: Dropdown Menus](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_csstricks_solved_by_css_dropdown_menus.jpg)
Solved with CSS: Dropdown Menus
Una Kravets covers how to create powerful and accessible dropdown menus powered by CSS.
4. Fonts
![Lash - free font](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_lash_font.jpg)
Lash
Lash is a free, tall and sharp font designed by Mehmet Reha Tugcu.
![MT Knox - Free font](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_font_mt_knox.jpg)
MT Knox
MT Knox is a free, condensed editorial display typeface designed by Morrison Type.
![Cunia - Free font](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_cunia_font.jpg)
Cunia
Cunia is a free, beautiful, bold and semi-rounded typeface designed by Alejo Bergmann
![Argon - Free font](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_argon_font.jpg)
Argon
Argon is a free, sharp and stylized typeface designed by Gianina Poma.
5. Icons
![Language Icons](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_icons_language.jpg)
12 Language Icons
A beautiful set of 12 vector icons from Max Panchyk.
![Lordicons](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_lordicons.jpg)
Lordicons
Lordicons is a free set of 50 animated SVG icons.
![Clothes and Shopping Icons](https://dgc2qnsehk7ta.cloudfront.net/uploads/rfwdd_icons_clothes_and_shopping.jpg)
Clothes and Shopping Icons
A free set of 40 clothes and shopping vector icons designed by Kasra Design.
6. Great Reads
- π[Webflow] How not to write an error message
- πThe next big thing in type?
- π[CSS Tricks] Inspecting animations in DevTools
- π[A List Apart] Priority Guides: A Content-First Alternative to Wireframes
- π[Imaginary Cloud] Is timeless UI design a thing?
- π[Medium] A 25-Step Program for Becoming a Great Designer
- πStyling buttons, the right way
What are your favorite tools or resources? Did we miss anything? If you liked this roundup make sure you share it! π
π₯π¦ Check the best tools and resources for web developers and designers from May 2018 Click To Tweet
π€ What do you think?