Join us on the demo, while our product experts provide a detailed walkthrough of our enterprise platform.

logoAsync

The latest news in the world of engineering.

Identity and Access Management (IAM), including security and customer experience.

Visit Blog
Fuel

Grow your business to millions.Engage and retain your customers.

Visit Blog

Best Free UI/UX Design Tools/Resources 2020

As a designer, often wondered which new tools and utilities, other designers are using? So here is a list of all the tools and utilities famous around the world in designers.

Hitesh Kumawat
Hitesh Kumawat
August 13, 2020
6 min read

Free, Secure and Trusted Way to Authenticate Your Visitors

Add login to your website in 5 minutes completely for free!

Free Sign UpNo hidden costs. No credit card needed.

Contents

  1. Inspiration
  2. Colour
  3. Components
  4. Mockups
  5. Design System
  6. Font
  7. Prototyping Tools
  8. Free Stock Photos
  9. Tools that speed up your workflow
  10. Collaboration Tools

Inspiration

These are the websites where the world’s top design talents share their works and ideas.

1. Behance -Top Creative Work On Behance

Showcase and discover the latest work from top online portfolios by creative professionals across industries.

www.behance.net

2. Dribble - Discover the World's Top Designers & Creative Professionals

Dribbble is where designers gain inspiration, feedback, community, and jobs and are your best resource to discover

dribbble.com

3. Awwwards - Website Awards(Best Web Design Trends)

Awwwards are the Website Awards that recognize and promote the talent and effort of the best developers and designers.

www.awwwards.com

4. Mobile UI Design Patterns

Mobbin - Latest Mobile Design Patterns

Check out the hand-picked collection of latest mobile design patterns from apps that reflect the best in design.

mobbin.design.com

5. UI Sources (Real App Interaction)

UI Sources | Mobile Design Patterns and Interactions

Over 500+ interactions from the world's best designed and highest-grossing apps.

www.uisources.com

6. Bestfolios - UI/UX Design Portfolio Inspiration and Showcase

The largest collection of the best portfolio websites from top designers in the industry.

www.bestfolios.com

7. Muzil Design Inspiration

Designers' Secret Source: all the design inspiration you need. Served fresh.

muz.li

Color Tools

Use these tools to explore different color schemes quickly.

1. Adobe Color

Create color schemes with the color wheel or browse thousands of color combinations from the Color community.

color.adobe.com

2. Color Tool — Material Design

Color Tool — Material Design

Create and share color palettes for your UI, and measure the accessibility of any color combination.

material.io

3. Muzil Color Palette Generator

Color Palette Generator - Create Beautiful Color Schemes

Search, discover, test and create beautiful color palettes for your projects

colors.muz.li

4. Colorable (Color contrast tester)

#000000 on #fff9b0

Contrast is the difference in luminance or color that makes an object (or its representation in an image or display)

colorable.jxnblk.com

5. ColorBox

ColorBox by Lyft Design

Colorbox is a color tool to produce color sets.

www.colorbox.io

6. Web Gradient

Free Gradients Collection by itmeo.com

Come to WebGradients.com for 180 beautiful linear gradients in CSS3, Photoshop, and Sketch.

webgradients.com

7. Brand Colors

BrandColors — official brand color hex codes

The biggest collection of official brand color codes around. Includes hex color codes for 500+ brands including…

brandcolors.net

8. Color Hunt

Color Hunt — Popular Schemes for Designers and Artists

A curated collection of the most popular and trendy color palettes. Get the perfect color ideas for your design.

colorhunt.co

Components

Drawing illustration could be time-consuming, why not start with this template and use it as a draft/underlay and build your design on top of that?

1. Undraw (Illustration)

unDraw | Colorful illustrations

Open-source illustrations for every project you can imagine and create.

undraw.co

2. Ouch by Icons8 (Illustration)

Free vector illustrations - Ouch.pics

Creators who don't draw face the problem of the boring content for app screens, articles, landing pages, and emails…

icons8.com

3. Opendoodle (Illustration)

Open Doodles - Free sketchy illustrations

A library of sketchy illustrations of people free for personal and commercial use.

www.opendoodles.com

4. Glaze (Illustration)

Glaze | Illustrations

Free illustrations, for everything. Memorable products, brands, & presentations start with our curated royalty-fr

www.glazestock.com

5. Iconscout (Illustration)

Iconscout - Curated SVGs, Vector Icons, Illustrations, 3D graphics, and Lottie Animations

Iconscout comes with integrated Plugins, conversion Tools, and simple, powerful Editors that enhance and streamline your workflow.

iconscout.com

6. UI Faces (Avatars for design mockups)

UI Faces - Avatars for design mockups

An aggregator that indexes various free avatar sources that you can use in your design mockups by copy-paste, API, plugins…

uifaces.co

Mockups

1. Facebook Design — Devices (Various HQ Device Mockup for download)

Facebook Design — Devices

Images and Sketch files of popular devices.

facebook.design

2. Free Mockup World

UI & UX - Best Free Mockups

Big library of high quality best free UI & UX mockups

www.freemockupworld.com

3. Is Graphics

Free Mockups and Design Tools [PSD, Sketch, Figma]

Huge collection of free mockups, patterns, illustrations, scene creators, DIY scenes, for Photoshop, Sketch, and Figma

www.ls.graphics

4. The Mockup Club

The Mockup Club - Best Free Mockups

A directory of the best free design mockups for Photoshop, Sketch, Figma, and InVision Studio.

themockup.club

Design Systems

1. iOS Human Interface Guideline - Apple

Design - Apple Developer

Find documentation and resources for designing great apps for Apple platforms.

https://developer.apple.com

2. Material Design — Google

Build beautiful, usable products faster. Material Design is an adaptable system-backed by open-source.

material.io

3. Airbnb Design

Building a Visual Language

Behind the scenes of our new design system, This article is part of a series on our new Design Language System.

airbnb.design

4. Uber Design

Uber Brand

With our company’s growth and new direction, we need a brand identity that is efficient to use, flexible across applications, and able to feature localized content in a globally consistent way.

brand.uber.com

5. Shopify Polaris

Our style guide helps us collaborate across disciplines to build a great experience for all of Shopify’s merchants.

polaris.shopify.com

6. Atlassian Design

Use Atlassian’s end-to-end design language to create straightforward and beautiful experiences.

atlassian.design

7. Microsoft Design

www.microsoft.com

8. Facebook Design Tools and Resources

A collection of tools and resources from Facebook Design.

facebook.design

Font

1. Google Fonts

Google Fonts

Making the web more beautiful, fast, and open through great typography

fonts.google.com

2. Typewolf

What’s Trending in Type · Typewolf

Typewolf helps designers choose the perfect font combination for their next design project-features web fonts in the…

www.typewolf.com

3. DaFont

DaFont - Download fonts

Archive of freely downloadable fonts. Browse by alphabetical listing, by style, by author or by popularity.

www.dafont.com

4. Font Squirrel

Free Fonts! Legit Free & Quality “ Font Squirrel

Font Squirrel scours the internet for high quality, legitimately free fonts.

https://www.fontsquirrel.com

5. Font Inspiration

Typ.io: Fonts that go together

Here at Typ.io, we're revealing designers' decisions for all to see; peeking under the hood of beautiful websites…

typ.io

Prototyping Tool

Create a testable design prototype for your interviewee and get feedback

1. Adobe XD

UI/UX design and collaboration tool | Adobe XD

Adobe XD is your UI/UX design solution for website and mobile apps creation. Design, prototype, and share. Try it now.

https://www.adobe.com

2. Invision

InVision | Digital product design, workflow & collaboration

InVision is the digital product design platform used to make the world's best customer experiences.

https://www.invisionapp.com

3. Figma

Figma: the collaborative interface design tool.

Figma helps teams create, test, and ship better designs from start to finish. Meet our customers Packed with design…

https://www.figma.com

4. Sketch

The digital design toolkit

Seamless integration to the Mac app makes saving to Cloud as easy as hitting ⌘S. From there, you can organize designs…

https://www.sketch.com

5. Origami Studio

Origami Studio - Design Prototyping

A new tool for designing modern interfaces, built and used by designers at Facebook

origami.design

6. Framer

Framer | A lightning fast interactive design tool.

A framer is coming to the web. Learn more › Why Framer X Resources Framer X Framer is coming to the web. Learn more › The…

https://www.framer.com

7. Principle

Principle

The principle makes it easy to design animated and interactive user interfaces. Whether you're designing the flow of a…

https://principleformac.com

8. Overflow

Meet Overflow

The world's first user flow diagramming tool tailored for designers. Build and present beautiful user flow diagrams…

overflow.io

Stock Photos

1. Pexels

Free stock photos · Pexels

Free stock photos you can use everywhere. ✓ Free for commercial use ✓ No attribution required

www.pexels.com

2.Unsplash

Beautiful Free Images & Pictures | Unsplash

Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock…

unsplash.com

3. Burst By Shopify

Free Stock Photos: High-Res Images for Websites & Commercial Use

Stunning stock images, perfect for blogs and websites Explore stock photography by category, all free for commercial…

https://burst.shopify.com

4. Moose

Moose - Free Stock Photos

A collection of stock photography in a single style. Good for collages. Free for commercial use.

https://photos.icons8.com

Tools that speed up your workflow

1. Glitch Image/Gif/Video Generator

PHOTOMOSH

Glitch images, videos, or webcam using WebGL effects. Save output as image, gif, or video.

https://photomosh.com

2. Duotone Image Generator

Duotone by ShapeFactory | Create Beautiful Free Duotones

Find beautiful free duotone images to use in any project, or make custom duotone images by uploading your own image and…

duotone.shapefactory.co

3. Compressor.io (Image compression tools)

Compressor.io - optimize and compress JPEG photos and PNG images

Compressor.io is a powerful online tool for reducing drastically the size of your images and photos whilst maintaining…

https://compressor.io

4. TinyPNG (Image compression tools)

TinyPNG - Compress PNG images while preserving transparency

Excellent question! Let me give you a side by side comparison. Below are two photos of my cousin. The left image is…

https://tinypng.com

5. Remove.bg (Background removal tool )

Remove Background from Image — remove.bg

made with ♥ All trademarks, service marks, trade names, product names, logos, and trade dress appearing on our…

www.remove.bg

6. Service Design Toolkit

Service Design Toolkit - Down­loads

This toolkit is an introduction to the methodology of service design

www.servicedesigntoolkit.orgs

Collaboration Tools

1. Zeplin (Collaboration & Handoff tool)

Zeplin

Connected space for product teams. Handoff designs and style guides with accurate specs, assets, code…

zeplin.io

2. Realtime Board (Collaboration Tool)

Team collaboration software & online whiteboard for teams | Miro

Scalable, secure, cross-device, and enterprise-ready team collaboration tool for distributed teams. Join 2M+ users &…

https://realtimeboard.com



LoginRadius Docs

Implement Authentication in Minutes

click here

Most Popular Tags

EngineeringJavaScriptReactAuthenticationNodeJsCSSSecurityC#JWTOAuth

Do you want a free authentication solution?

Add the world's most secure, reliable and easy to implement user authentication solution on your applications at $0Get Started Free

Hitesh Kumawat

Hitesh Kumawat

I care deeply about creating world-class, useful, and beautiful products and web that help people and make a difference. I can be as involved in your project as you need me to be; from the seed of the idea, to design, creative direction, system design, and even the front-end and WordPress build.

View Profile

Try a Modern Authentication Solution

$0/ month

Free Sign Up
  • 7,000 Monthly Active Users
  • 1 Web or Mobile App
  • Email/Password Login
  • 3 Social Login Providers
  • User Data Storage
  • Transactional Email Template
  • Customizable Login Interfaces