Massive UI/UX Graphic Designer's Tools and Tricks List

Websites and resources with modern UI components in different formats such as PSD, Sketch, Figma, etc. They are great for ideas for web components/UI.

Dec 19, 2021 - 03:08

Feb 7, 2023 - 10:11

0 311

Massive UI/UX Graphic Designer's Tools and Tricks List

UI Graphics

Websites and resources with modern UI components in different formats such as PSD, Sketch, Figma, etc. They are great for ideas for web components/UI

Website	Description
UI Design Daily 100	Awesome UI Components of all types
100 Daily UI 32	Free Figma library of products, elements, and screens
Sketch App Sources 18	Sketch UIs, wireframes, icons and much more
Humaaans 29	Cool illustrations of people with the ability to mix and match
Paaatterns 19	Free collection of beautiful patterns for all vector formats
thepatternlibrary 18	Free beautiful background patterns
404 illustration 25	free illustrations for 404 pages
Drawkit.io 18	Illustrations for designers and startups
Undraw.co 10	Open-source illustrations for any idea you can imagine and create
Illustration.co 22	Open-source illustrations kit
Manypixels.co 9	Monochromatic, Isometric high quality illustrations
Opendoodles 15	Free sketchy illustrations
Open Peeps 7	Hand drawn illustration library
UI Space 20	Thousands of great UI freebies
Animations.co 23	Beautiful, customizable animated GIF icons
Uplabs 14	High-quality design resources (Free & Premium)
InvisionApp 10	Library of free, high-quality UI kits, icon packs, and mockups
Open Doodles 15	A Free Set of Sketchy Illustrations
Avataaars 9	Free sketch library of avatars illustrations by Pablo Stanley
FreebieSketch 13	Free Sketch designs, wireframes, illustrations, and more.
Blush 7	Free customizable illustrations with Figma Plugin
Hero Patterns 18	A collection of repeatable SVG background patterns

Fonts

Websites that offer free fonts as well as font based tools

Website	Description
Google Fonts 5	Library of around 1000 free licensed font families
DaFont 2	Archive of freely downloadable fonts
Use & Modify 2	Personal selection of beautiful, classy, punk, professional, incomplete, weird typefaces
1001 Free Fonts 1	I think the name speaks for itself
Font Squirrel 1	Font Squirrel scours the internet for high quality, legitimately free fonts
Font Fabric	A digital type foundry crafting retail fonts and custom typography for various brands
What Font	Tool for finding the fonts of a website without having to search in the devtools
Tiff 1	A type diff tool that visually contrasts the differences between two fonts
Font Flame 1	Tool for pairing fonts to see how they look together
TypeKit Practice	Learn about typography practices
Fontjoy	Generate font pairing in one click
Golden Ratio 1	Golden Ratio Typography Calculator
FontSpark 1	Discover Better Fonts
FontPair	Helps you pair Google Fonts together
Font Space	A designer-centered free font website that has quick customizable previews
Abstract Fonts 3	Fonts free for personal and commercial use
Free Typography 2	A list of high quality fonts
Leon Sans 1	A geometric sans-serif typeface made with code
Lexend	A variable font empirically shown to significantly improve reading-proficiency
Fonts for Apple Platforms	Get the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps
SFWin	San Francisco Fonts for Windows 10 and non-Apple Platform
Font Flipper	Preview 800+ Google Fonts on top of your own designs, without having to download the fonts
Fonts Arena 1	Free curated fonts
Befonts 2	High quality fonts for free
Arabic fonts 1	Arabic fonts for free
FontDrop	Simple and easy way to view the contents of font files

Colors

Websites and resources that help with choices related to colors

Website	Description
Colormind.io 16	Color palette generator
ColorCurves.app 4	Color palette generator that uses curves to generate color palettes
Coolors 4	Create the perfect palette or get inspired by thousands of beautiful color schemes
Colors & Fonts 3	A curated library of colors, fonts and resources
Palette List 4	Pick 2 colors you like and the tool generates thousands of palettes for you.
Google Material Color Tool 5	Official Google Material Color Palette Tool
Material Palette 2	Free to pick palettes, icons and colors for Material Design
ColorSpace 1	Generate nice color palettes from one color
FlatUIColors 2	Beautiful set of color palettes in various flavours
Adobe Color 1	Create color palettes, extract gradients from images, etc
Colorsinspo 1	All-in-one resource for finding everything about colors
Happyhues 1	Happy Hues is a color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects by Mackenzie Child
Adobe Trends 2	Discover current color trends in different industries from the creative communities on Behance and Adobe Stock
Color Hunt	A free and open platform for color inspiration with thousands of trendy hand-picked color palettes
Gradient Hunt 2	A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
Web Gradients 7	A free website to find good css gradients
ColorBox	A free website to produce color set
CSS gradient 3	A free website to make custome gradient and some examples of gradient
gradienta	A pure css and jpg gradients
UI Gradients 2	UI gradients color generator
Palette Generator 1	Generate new color palette with every spacebar press
Material Palettes	1000+ Material Design palettes
Grabient	Gradient Selector
ShadeSwash 1	Quickly generate shades of any color
BrandColors 1	The biggest collection of official brand color codes
BRAND PALETTES 3	Logo Color Codes and Palettes
ColorSpace 1	Generate color palettes from one color
Material Design Palette Generator 2	Generate theme and color palette Material Design-like
Colorate	Color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.
0to255	A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.
Gradient Buttons 2	Ready to use copy/paste gradient buttons
Khroma 2	Khroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.
whocanuse	A tool that brings attention and understanding to how color contrast can affect different people with visual impairments.
Colorable	Color combination contrast tester
Color Hex Picker	Tool to get hex code along with name of the color.
Saruwakakun	The stunning color scheme for website & App Designs with previews
Paletton	Paletton.com is a designer color tool designed for creating color combinations that work together well.
Colorzilla	A powerful online photoShop-like CSS gradient editor
Image Color Picker	Image color picker and palette generator
CombineCOLORS	Color mixing tool

Icons

Resources for Icons including png, svg and more

Website	Description
UXWing 15	Well Optimized, Free icons for commercial use
Shapedfonts Iconclub 13	8000+ free icons
Feather Icons 1	Beautiful, customizable open source icons
Tabler Icons 2	470+ highly customizable open source SVG icons
Simple Icons 6	1307 Free SVG icons for popular brands
Instant Logo Search 6	thousands of free brands logos ( SVG - PNG )
Linear Icons 2	1000+ Ultra crisp vector icons
Entypo 3	411 carefully crafted premium pictograms by Daniel Bruce
Icons8 3	Free icons, photos, vectors and tools
Flat Icon 4	The largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
The Noun Project 3	Over 2 Million curated icons, created by a global community
Iconscout 1	Free Download Icons illustrations stock photos at one place
Nucleo App 1	Nucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid)
Icon-icons.com 1	Free Icons PNG, ICO, ICNS and Vector file SVG
Bootstrap Icons 3	Free Icons built for Bootstrap but they’ll work in any project
Remix Icon 1	Simply Delightful Icon System
Iconmonstr 1	Discover 4496+ free icons in 313 collections
Vivid.js 1	Ready to use Free and Open Source SVG Icons Pack JavaScript Library.
Iconfinder 3	Free and premium vector icons in SVG, PNG, CSH and AI format
Lordicon 1	50 free animated interactive icons
UseAnimations 3	Free Animated Icons in SVG and Json Format(for lottie)
css.gg 1	700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API
SVGPorn 6	1000+ high-quality SVG logos
Payment System Logos	Logos for payment systems available in png and svg
Browser Logos 2	High resolution web browser logos
IconBros	7843+ free icons grouped in 182 collections
LogoHub 2	Generate and download your logo for free in PNG and SVG format
Material Design Icons 2	A icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
Heroicons 1	Free, open source icons from the creators of Tailwind CSS.
Zondicons 1	A set of free premium SVG icons for you to use on your digital products.
Endless Icons 1	A website offering a number of free icons. Icons are tagged and also compressed into kits.
Icomoon	Browse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.
Eva Icons	Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.
Zondicons	A set of free premium SVG icons for you to use on your digital products. you can download the icons into your desktop
Entypo 3	411 carefully crafted premium pictograms
Cryptoicons	A set of 430 crypto and fiat currency icons. Completely free.
Ikonate	Fully customisable & accessible vector icons
appicon	Quickly generate app icons in diffrent sizes for your IOS, macOS and Android projects
LineIcons 1	2000+ Essential Line Icons for Designers and Developers

Favicons

Resources for Favicons

Website	Description
Favicon.io 9	Generate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
Favicon Generator 1	Generate favicon ico files for your website
RealFaviconGenerator 2	Generate icons for all platforms (Windows, iOS, Android)
FontIcon 2	Generate favicons and images from Font Awesome icons

Icon Fonts

Resources for Icon Fonts

Website	Description
Font Awesome 3	The web’s most popular icon set and toolkit
Line Awesome 1	Swap in replacement of Font Awesome with modern line icons
Material Icons	Material design icon library
IonIcons 1	Beautifully crafted open source icons from Ionic team
Zurb Foundation Icons	Customizable Foundation icons
Fontisto Icons 1	Fontisto the iconic font and css toolkit · 616+ free icons
Boxicons	Boxicons is a free collection of carefully crafted open source icons
Icofont	2100+ free icons to spice up your creative designs
Material Palette	Free to pick palettes, icons and colors for Material Design]
Material Design Iconic Font	Material design icon font
Vscode Codicons 2	The icon font from Visual Studio Code
Devicon	Devicon is a set of icons representing programming languages, designing & development tools
PaymentFont 2	A sleek webfont for payment operators and methods. Featuring 116 icons
Weather Icons	Weather Icons is the only icon font with 222 weather themed icons
Stroke 7	202 thin stroke icons inspired by iOS 7
Jam Icons	890+ handcrafted icons to make your web app awesome
Fontastic.me 2	Create your custom icon fonts in seconds. Over 9,000 icons available to pick from or upload your custom svg
Fontello 1	200+ web icons where you can customize the names or codes of icons.
Linea 1	Linea: Featuring 750+ Free Icons

Stock Photos

Websites that offer free stock photos of all kinds for your websites and apps

Website	Description
Pexels 15	Free stock photos shared by talented creators
Unsplash 6	The internet’s source of freely usable images
Pixabay 6	Over 1.7 million+ high quality stock images and videos
Magdeleine 6	Gallery & free high res photo everyday
Picspree 3	Royalty free images, stock photos, illustrations, and vectors
Burst 3	Free stock photos collections
Gratisography 2	Free collection of free high-resolution pictures
Life of Pix 1	Free high resolution photography
Stock Snap	Hundreds of high quality photos added weekly
Morguefile 1	Over 350,000 free stock photos for commercial use
Kaboom Pics	Stock photography and color palettes. Good for product images
New Old Stock 1	Stock vintage photos
Pic Jumbo	Good collections of different types of photos
Public Domain Pictures	Public domain images of all types
Find A Photo 1	Searches multiple stock photo websites
Stockvault	Categorized stock photos
Placeholder	A free image placeholder service for the web. You can specify image size and format
Realistic Shots 1	Free high resolution stock photos
Negative Space	High-Resolution Free Stock Photos
SkitterPhoto	Free high resolution photography
PicoGraphy	Gorgeous, High-Resolution, Free Photos
Wunder Stock 1	Stunningly amazing free photos
PxHere	Free Images & Free stock photos - PxHere
Piqsels	Royalty Free Stock Photos
FoodiesFeed 1	Food photo stock
Nappy	A website offering Beautiful, high-res photos of black and brown people.
Generated Photos 4	Unique AI Generated model photos

Stock Videos

Websites that offer free stock videos of all kinds for your websites and apps

Website	Description
Pexels 7	Largest library of free to use videos, donated by the community
Pixabay 1	Large library of free to use videos, donated by the community similar to Pexels
Coverr.co 4	Beautiful free stock video footage
Videezy 4	Free HD stock footage & 4K videos
Mix Kit 2	Stock video clips & music
Life Of Vids 4	Free video clips and loops
Videvo 8	Free and premium stock videos

Stock Music & Sound Effects

Websites that offer free stock music and/or sound effects

Website	Description
Free Stock Music 4	Royalty free stock music for YouTube videos, podcasts, etc
Bensound 2	Download Royalty Free Music for free and use it in your project
Mixkit 2	Free music for your projects
Freesound 1	Free stock music and sounds
Free Music Archive 1	Collaborative database of creative-commons licensed sound for musicians and sound lovers
Musopen 2	An online copyright free classical music library
Unminus 2	Free Premium Music for Your Projects Royalty Free. Cleared for YouTube.

Vectors & Clip Art

Free vectors, clipart, illustrations, patterns and more

Website	Description
Vecteezy 7	Find and download free vector art
Freepik 8	Free vectors, stock photos, PSD and icons
Free Vectors 5	Community of vector lovers who share free vector graphics
PNGTree 9	png, backgrounds, templates, text effects
Vector4Free 1	Free vector graphics
Retro Vectors 2	Vintage vectors and graphics
Freeble	Vectors, patterns, mockups and more
Lukaszadam 3	Free Vector atrworks
Illlustrations 22	Beautiful 100 Illustrations - png, svg
Clipart 6	Choose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
Growwwkit illustrations 3	A set of 8 simple, black & white, stylish illustrations
World Vector Logo 3	Download vector logos of brands you love
trianglify.io 3	Generate low-poly backgrounds, textures, and vectors
blob 1	Generate Blob shapes for Web and Flutter apps
HiClipart 5	A community for designers to share & download transparent background PNG cliparts

Product & Image Mockups

Create mockups of devices and other products

Website	Description
Smart Mockups 10	Create stunning product mockups (free & premium)
Shot Snap 4	Create beautiful device mockup images for your app or website design
Screely 3	Instantly turn your screenshot into a mockup
Screen Peak 4	Create a mockup from a URL
Mockup World 4	The biggest source of free photo-realistic Mockups online
Collab Shot	Real-time screen grabs and image sharing
Facebook Devices	Images and Sketch files of popular devices
Threed.io 6	Generate 3D mockups right in your browser.
Mockuphone 1	100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TV