Savio Martin

Savio Martin

111 amazing resources you're gonna love πŸ’–

111 amazing resources you're gonna love πŸ’–

Enjoy this huge list of amazing resources!

Subscribe to my newsletter and never miss my upcoming articles

Listen to this article

Hello Devs πŸ‘‹

This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend technologies.

Today, I'm gonna share 100+ super amazing resources every developer are gonna love for sure πŸ’– I hope you'll enjoy this article.


3 UX/UI Design Systems to gain inspiration

3 tools every UX/UI designer should know

  • πŸ“’ Notion - is an all-in-one workspace to organise your notes, projects and tasks

  • 🎸 Figma - is a multiplayer interface design tool to create mockups, design systems and prototypes ⁣

  • ⭐️ Miro - is a real-time whiteboard to gather research and ideate with team mates ⁣

3D websites that will inspire every UX/UI designer ⁣

  • 🍻 Protopie.com - go the extra mile with 3D video and awesome animations on scroll

  • ♻️ Pitch.com - began the 3D movement and their characters are super friendly and feature in their website and product. ⁣

  • πŸ’― kukla-kit.com - is a 3D library for Figma projects

3 chrome extensions for every UX/UI Designer ⁣

  • ⌨️ Font Ninja lets you inspect and bookmark fonts and any webpage⁣

  • πŸ’» Go Full Page takes full page screenshots of any webpage ⁣

  • πŸ”₯ Loom lets you record videos directly in chrome

3 Illustration Libraries for UX/UI Designers ⁣

  • 🌈 Absurd.Design have expressive illustrations for products with personality ⁣

  • πŸ₯° Blush.design have a great mix of characters from artists around the world ⁣

  • 🌟 Ouch! - have a comprehensive library of searchable illustrations

3 Typography tools for UX/UI Designers ⁣

  • 🍭 Fontjoy.com generates font pairings with a contrast slider in a single click ⁣

  • 🍟 app.typeanything.io let’s you experiment with font pairings, sizes, spacing, and weights live i. The browser ⁣

  • 🎨 Font Base is a free font manager with access to Google’s fonts for Mac and windows

3 color tools for UX/UI Designers ⁣

  • 🎹 picular.co generates colors based on keywords ⁣

  • πŸš† Coolhue is a gradient plugin for Figma & Sketch ⁣

  • πŸš€ Eva uses AI to generate feedback colors based off your brand color

3 user testing tools for UX/UI Designers ⁣

  • πŸŽ‰ Maze.design is great for running unmoderated tests as it integrates smoothly with your existing prototyping workflow ⁣

  • ✨ Lookback.io is super for moderated usability tests of your product live with users ⁣

  • πŸ€™ Usertesting.com is an accessible tool for your whole team to test with

3 3D libraries for UX/UI Designers ⁣

  • πŸ€ Shapefest.com is a massive library of 3D shapes ⁣

  • πŸ“Ž Storytale.com has a great mix of 3D characters and objects ⁣

  • πŸ₯³ Toy Faces is a super fun 3D avatar library

3 Prototyping tools for UX/UI Designers ⁣⁣

  • πŸ’« Figma lets you effortlessly create prototypes whilst you design ⁣

  • 🍿 Framer has an extensive library of notions and tutorials to help you learn how to prototype ⁣

  • 🀯 Protopie helps you create mind blowing prototypes with native elements

3 sites to gain inspiration as a UX/UI Designer ⁣

  • πŸ“± mobbin.design is a hand picked collection of the latest mobile design patterns ⁣

  • πŸ’Ό Land-Book.com is a great place for landing page and portfolio inspiration ⁣

  • πŸ€ Dribbble is perfect for conceptual thinking and experimental design

3 productivity tools for UX/UI Designers ⁣

  • πŸƒβ€β™‚οΈ Notion is perfect for organising your weekly tasks and design team wiki ⁣

  • πŸ… Tomato 2 is a super app for following the pomodoro technique and managing your time ⁣

  • πŸ“… Calendly helps your organise meetings without the back and forth emailing.

3 accessibility tools for UX/UI Designers ⁣

  • 🎨 colorable.jxnblk.com - Colorable is a great tools for generating an accessible color palette ⁣
  • πŸ’― getstark.co - Stark is a super Figma, XD, Sketch plug-in for running contrast and color blind tests live in your designs ⁣

  • 🌊 Wave is a wicked chrome extension for running an accessibility evaluation live on your site.

3 free image libraries for UX/UI Designers ⁣

  • πŸŽ₯ pexels.com - Pexels is a super resource for free images and videos ⁣

  • 🌍 unsplash.com - Unsplash has powerful search, filters and collections from around the world ⁣

  • ✌️ Reshot.com - Reshot is another super image resource with handpicked, non-sticky images.

3 font resources for UX/UI Designers ⁣

  • ⚑️ Google fonts has over 1k searchable fonts categorised by type. ⁣

  • πŸ“¦ Open Foundry is a super resource for handpicked open-source typefaces ⁣

  • 🐺 Typewolf is super for learning about fonts and font pairings.

3 portfolio tools for UX/UI Designers ⁣

  • ⚑️ Super.so is quick and easy way to convert your Notion docs into an online portfolio ⁣

  • πŸ–₯ Webflow.com lets you design your portfolio directly in the browser across multiple devices ⁣

  • πŸ–Š Grammarly.com fixes your grammar errors helping you write better case studies

3 no-code tools for UX/UI Designers ⁣

  • ⚑️ Webflow is the best no-code website builder with awesome interactions ⁣

  • 🍬 Bubble is a great tool for building web apps without code ⁣

  • πŸ’΅ MemberStack is a no-code membership tool for any website

3 UX Writing resources for UX/UI designers⁣

  • ✍️ dailyuxwriting.com have super how to guides to up your writing game⁣

  • πŸ€™ Uxlibrary.org define the value of UX Writing with super ux writing blog links ⁣

  • πŸ“– uxplanet.org is an awesome handbook for UX writers⁣

3 Figma plugins for UX/UI Designers ⁣

  • β†ͺ️ Autoflow allows you to neatly draw the flows between your frames ⁣

  • πŸ‘€ Color-Palettes font picker lets you view typefaces before you select them ⁣

  • πŸ“Έ Unsplash is super for adding awesome stock images to your designs

3 color gradient tools for UX/UI Designers ⁣

  • πŸ‘€ webgradients.com have 180 awesome gradients with full screen preview ⁣

  • πŸ’ͺ coolors.co have a super gradient maker with a neat toggle between radial and linear ⁣

  • ⚑️ uigradients.com is a super resource to grab limitless gradients with a neat full screen toggle

3 user flow libraries for UX/UI Designers ⁣

  • πŸ“± uxarchive.com have a super library of user flows from top mobile apps ⁣

  • ⚑️ Mobbin.design is the largest user flow library that you can click through on a device ⁣

  • 🍿 pageflows.com is an awesome user flow library with web and mobile apps

3 icon libraries for UX/UI Designers ⁣

  • πŸ’‘ Ikonate.com is a super library of customisable icons that you can preview in dark mode ⁣

  • ⚑️ Useanimations.com is an awesome library of animated icons ⁣

  • πŸ‘€ Streamline.to is an icon app and plugin with over 30k icons to use

3 AI powered tools for UX/UI Designers ⁣

  • 🎨 Khroma.co is an AI powered color palette generator based on your fave colors ⁣

  • ✏️ UIzard.io is an AI tool that converts your sketches into mockups ⁣

  • πŸ“Έ remove.bg is an AI tool that removes any background from an image

3 color palette tools for UX/UI Designers ⁣

  • 😁 happyhues.co is a color palette tool that lets you view curated colors in context ⁣

  • 🌈 colorinspo.com let’s you generate a color palette based on color theory ⁣

  • ⚑️ Colors.muz.li is a color palette generator with a live UI kit demo

3 Zoom alternatives for UX/UI Designers ⁣

  • πŸ‡³πŸ‡΄ Whereby.com is a no fluff video meeting tool made by a secure friendly team in Norway⁣

  • πŸ’­ Vowel.com is a video conference tool that helps you host, plan and transcribe meetings ⁣

  • πŸ“ˆ Macro.io is an interface tool for Zoom that allows you to visualise meeting discussions

3 white boarding tools for UX/UI Designers ⁣

  • πŸ•Ή Freehand by Invision is a quick and easy to use whiteboarding tool⁣

  • ⚑️ Miro is a super tool with loads of handy templates to kickstart your white boarding sesh ⁣

  • 🎨 Mural is a great white boarding tool to use with your team ⁣

3 grid extensions for UX/UI Designers ⁣

  • πŸ“ Page Ruler is super for defining the spacing between components ⁣

  • 🎾 Baseliner is a super grid extension for applying a baseline to your design ⁣

  • 🎹 Grid Overlay is a great for applying a grid system directly to any page

3 awesome AI tools for UX/UI Designers ⁣

  • 🎨 tailwind.ink is an awesome AI color shade generator ⁣

  • πŸ”₯ visualeyes.design is a AI heatmap generator for your designs ⁣

  • βœ‚οΈ Clipdrop is a super AR copy paste tool for adding images, objects, and text to your design ⁣

3 massive Design Systems to inspire UX/UI Designers ⁣

  • βœ… Atlassian.design have a mammoth design systems with neat accessibility checks ⁣

  • πŸ‘€ buffer have a huge design systems with super guidelines on each component ⁣

  • πŸŒ” IBM whopping carbon design system works across a light and dark theme

3 super fun typography tools for UX/UI Designers ⁣

  • πŸ’» wordmark is a super tool that previews every font on your computer ⁣

  • πŸŽ‰ Prototypo is a super tool for creating your own font⁣

  • πŸ’― kerntype is a game that helps you learn how to learn type

3 device mockup generators for UX/UI Designers ⁣

  • πŸ’» previewed.app is a super 2D and 3D device mockup generator across devices ⁣

  • 🀯 threed.io is an awesome 3D mockup generator directly in the browser ⁣

  • ⚑️ Rotato is a super animated mockup generator

3 animated icon libraries for UX/UI Designers ⁣

3 super analytics tools for UX/UI Designers ⁣

  • πŸ‘ useFathom.com is a super simple and visual analytics tool for your product ⁣

  • 🀩 Plausible.io is another awesome analytics tool with a neat UI ⁣

  • ⚑️ Useberry.com is great for grabbing analytics directly on your prototype

3 super productivity tools for UX/UI Designers ⁣

  • 🏑 meetsidekick.com is a super browser that gives your apps a home and removes the need for cluttered tabs ⁣

  • βœ… getslash.co is an awesome tool that helps you complete your to do list ⁣

  • πŸ“§ hey.com is a super tool that makes emails fun and easy to manage

3 character illustration libraries for UX/UI Designers ⁣

  • πŸ‘– Humaaans is an awesome illustration library of characters that you can mix and match ⁣

  • πŸ” control.rocks is a super illustration library with loads of characters and scenes ⁣

  • πŸ‰ struct.rocks is a super fun character illustration library based on shapes

3 agency websites to inspire UX/UI Designers ⁣

  • 🦡🏼 Toyfight.co use humour to demo the value of a small team ⁣

  • πŸ»β€ Hellomonday.com use playful characters to showcase the diversity of their agency ⁣

  • πŸ§‘β€πŸš€ majortom.com use animation on scroll to showcase their iterative

3 must read books for UI/UX Designers


πŸ‘€ Wrapping Up

Yeah, that's a wrap. Hope you enjoyed these amazing resources and you're satisfied with this article. Do not hesitate to share your feedback. I am on twitter @saviomartin7. Give a follow!

Do you know more? Add them in the comments?

🌎 Lets connect

πŸ™Œ Support

My projects are fueled by coffees β˜•, get one for me! β˜•

Interested in reading more such articles from Savio Martin?

Support the author by donating an amount of your choice.

Recent sponsors
Β 
Share this