Winning Design Resource
Solutions to Common UI Challenges
Collection of Design Resources
🎉 All free or open source.
Note: Updated for 2022-2024+
Contents
- Website Templates
- Image Design & Editing
- Fonts
- Color Palettes
- Animations
- Photos
- Illustrations & Icons
- Website Hosting
- Other Resources
Website Templates
- https://html5up.net
- Landing & Splash Pages (added 2021)
- https://www.creative-tim.com/templates/react-free
- https://csslayout.io/patterns
Image Design & Editing
Web-based graphics creation tools.
- Modyfi - Fully interactive collaborative animation suite!
- PhotoPea - Photoshopish Clone
- VectorInk
- Gravit Designer Now owned by Corel.
- Best Snip SVG Animator
- SVGo SVG Compressor Compression & optimization utility.
- Boxy SVG Requires Chrome/WebKit/Edge/Opera.
Fonts
- FontSource
- Google fonts: https://fonts.google.com/
- The Stocks: http://thestocks.im/ (includes fonts, icons, etc.)
- FontPair: https://fontpair.co/fonts/
Color Palettes
- Adobe: https://color.adobe.com/create/color-wheel/
- Color Hunt: https://colorhunt.co/
- Coolers: https://coolors.co/
Animations
- Hover.css: http://ianlunn.github.io/Hover/
- Animate.css: https://daneden.github.io/animate.css/
- Anime.js: https://animejs.com/
- magic.css: https://www.minimamente.com/project/magic/
- bounce.js: http://bouncejs.com/
- Green Sock: https://greensock.com/gsap
- Hamburger Menu Animations: https://github.com/jonsuh/hamburgers
Photos
- Unsplash: https://unsplash.com/
- Pexels: https://www.pexels.com/
- The Stocks: http://thestocks.im/ (includes fonts, icons, etc.)
- CSS Clips: https://bennettfeely.com/clippy/
- WoC in Tech Chat: https://www.flickr.com/photos/wocintechchat/
Illustrations & Icons
- https://simpleicons.org/ - Over 3,000 brand icons. (2024)
- https://icomoon.io/app/#/select - easily export custom SVG & PNG sets (2021, 2023)
- https://thenounproject.com - Icons and Photos For Everything. (2023)
- https://iconoir.com - Over 1,000 free SVG icons. (2022)
- https://react-kawaii.vercel.app/#/Components - Cartoon SVG components.
- https://www.svgrepo.com/ (2021-02)
- https://isometric.online/ (added 2021)
- https://icons8.com/illustrations (added 2021)
- https://www.manypixels.co/gallery/ (added 2021)
- https://www.drawkit.io/free (added 2021)
- https://illlustrations.co/ (added 2021)
- https://generator.opendoodles.com/ (added 2020)
- Humaaans: https://www.humaaans.com/ (added 2020)
- Vecteezy: https://www.vecteezy.com/ (added 2022)
- Font Awesome: https://fontawesome.com/v6/search?o=r&m=free
- Undraw: https://undraw.co/illustrations - you can change the color on these illustrations to match your color palettes!
Website Hosting
- https://render.com/ (2023)
- https://www.netlify.com/
- https://pages.github.com/
- https://zeit.co/now
- https://surge.sh/
Other Resources
- http://codingheroes.io/resources/
- http://thestocks.im/ (includes fonts, icons, etc.)
- https://pixlr.com/x/ (online image editor)
- Shadow Designer - CSS