As a designer, people also wondered what new tools and utilities were used by other designers? Well, we have compiled a list of all the designers’ resources and utilities recognized worldwide. These free design resources are recommended by the expert designers to assist you in this mission. Check out the list and you can finally pick the ones that suit your requirements correctly.

This is a GitHub repo bradtraversy/design-resources-for-developers: Curated list of design and UI resources from stock photos, web templates, CSS frameworks, UI libraries, tools and much more started by Brad Traversy, a popular online instructor and full-stack web developer.

To identify different types of design resources, this article will be divided into 31 categories as below:

2022-Top-1000-Best-Free-Design-Resources-For-Startups-And-Side-Project-Part1 2022-Top-1000-Best-Free-Design-Resources-For-Startups-And-Side-Project-Part2 2022-Top-1000-Best-Free-Design-Resources-For-Startups-And-Side-Project-Part3

Table Content

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

WebsiteDescription
UI Design DailyAwesome UI Components of all types
100 Daily UIFree Figma library of products, elements, and screens
Sketch App SourcesSketch UIs, wireframes, icons and much more
HumaaansCool illustrations of people with the ability to mix and match
PaaatternsFree collection of beautiful patterns for all vector formats
thepatternlibraryFree beautiful background patterns
404 illustrationFree illustrations for 404 pages
Drawkit.ioIllustrations for designers and startups
Absurd.designFree surrealist illustrations for designers and developers
Undraw.coOpen-source illustrations for any idea you can imagine and create
Manypixels.coMonochromatic, Isometric high-quality illustrations
Open PeepsHand drawn illustration library
UI SpaceThousands of great UI freebies
Animations.coBeautiful, customizable animated GIF icons
UplabsHigh-quality design resources (Free & Premium)
InvisionAppLibrary of free, high-quality UI kits, icon packs, and mockups
Open DoodlesA Free Set of Sketchy Illustrations
AvataaarsFree sketch library of avatars illustrations by Pablo Stanley
BlushFree customizable illustrations with Figma Plugin
Hero PatternsA collection of repeatable SVG background patterns
BEAUBUS PatternsA set of 150+ free SVG patterns (backgrounds)
IsoFlatA Free collection of Isometric SVG graphic resources
IRA DesignAn open-source gradient illustrations collection by creative tim.
Transparent TexturesA collection of transparent textures background patterns.
icons8.com/illustrationsFree vector illustrations to class up your project
PatternicoSeamless Pattern Maker
FreellustrationsFree Background Images for awesome landing Pages
Pixeltrue IllustrationsFree Animated Illustrations
Abstract User Avatar APIAPI to create simple yet flexible user avatars from user names or emails
sketchvalleyDownload free PNG, SVG or AI file .
PatternPadFree and unlimited unique pattern designs.
DimensionsDimensions.com is an ongoing reference database of dimensioned drawings documenting the standard measurements and sizes of the everyday objects and spaces
FreebiesbugHand-picked resources for web designers and developers, constantly updated.
FlexipleOne new high-quality, open-source illustration each day.
Cool TextCool Text is a FREE graphics generator for web pages and anywhere else you need an impressive logo without a lot of design work
illustration kitPremium open source illustrations added daily
Doodad Pattern GeneratorCreate unique, seamless, royalty-free patterns.
Pattern MonsterA simple online pattern generator to create repeatable SVG patterns
ExemplarFree Avatar Library for Figma and Sketch
UIBundleThousands of Free Design Resources like UI Kits, Mockups, Illustrations, Icons, Fonts, 3D assets, Templates and more.
openby.designCustom crafted free UI design resources, for personal and commercial projects. No attribution is required.
Design StripeCreate beautiful illustrations, no design skills needed.
HOLA SVG!An SVG playground to share SVG stuff.
symu.coFree templates, UI kits, icon, PSD
Mesh GradientGenerate & download beautiful mesh gradients.

Fonts

Websites that offer free fonts as well as font-based tools

Website                           Description
Google FontsLibrary of around 1000 free licensed font families
DaFontArchive of freely downloadable fonts
Use & ModifyPersonal selection of beautiful, classy, punk, professional, incomplete, weird typefaces
1001 Free FontsI think the name speaks for itself :smirk:
Font SquirrelFont Squirrel scours the internet for high quality, legitimately free fonts
Font FabricA digital type foundry crafting retail fonts and custom typography for various brands
TiffA type diff tool that visually contrasts the differences between two fonts
TypeKit PracticeLearn about typography practices
FontjoyGenerate font pairing in one click
Golden RatioGolden Ratio Typography Calculator
FontGetHas a variety of fonts available to download and sorted neatly with tags
FontPairHelps you pair Google Fonts together
Font SpaceA designer-centered free font website that has quick customizable previews
Abstract FontsFonts free for personal and commercial use
Free TypographyA list of high quality fonts
Leon SansA geometric sans-serif typeface made with code
LexendA variable font empirically shown to significantly improve reading-proficiency
Fonts for Apple PlatformsGet the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps
SFWinSan Francisco Fonts for Windows 10 and non-Apple Platform
Font FlipperPreview 800+ Google Fonts on top of your own designs, without having to download the fonts
Fonts ArenaFree curated fonts
BefontsHigh quality fonts for free
Arabic fontsArabic fonts for free
FontDropSimple and easy way to view the contents of font files
Open FoundryFREE platform for curated open-source typefaces
GlyphterUpload your own SVGS and turn them into font files. Useful if you want a smaller library loaded
Google Webfonts HelperA Hassle-Free Way to Self-Host Google Fonts
Rough Font AwesomeWhen RoughJS meets Font Awesome
FFontsStylish fonts for free
Malayalam FontsMalayalam fonts for free which are maintained by Swathanthra Malayalam Computing(SMC)
Dev FontsFind and use the coding fonts for free
Font MFree font you can download for material coding and design
W FontsDownload Free fonts
Modern fluid typography editorFluid typography is a modern way of approaching responsive typography.

Colors

Websites and resources that help with choices related to colors

Website                           Description
Color Brewer 2The original color palette generator, also supporting color blindness. Probably the scientifically best option. Also probably not the prettiest.
HuetoneA tool to create accessible color systems.
Colormind.ioColor palette generator
ColorCurves.appColor palette generator that uses curves to generate color palettes
ColorGradientA free tool to create simple and complex CSS Gradients visually
CoolorsCreate the perfect palette or get inspired by thousands of beautiful color schemes
HTML Color CodesGet HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names
Colors & FontsA curated library of colors, fonts and resources
Palette ListPick 2 colors you like and the tool generates thousands of palettes for you.
Google Material Color ToolOfficial Google Material Color Palette Tool
Material PaletteFree to pick palettes, icons and colors for Material Design
ColorSpaceGenerate nice color palettes from one color
FlatUIColorsBeautiful set of color palettes in various flavors
Adobe ColorCreate color palettes, extract gradients from images, etc.
ColorsinspoAll-in-one resource for finding everything about colors
ColorsWallPlace to store your color palettes and generate palette in one click
HappyhuesHappy 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 TrendsDiscover current color trends in different industries from the creative communities on Behance and Adobe Stock
Color HuntA free and open platform for color inspiration with thousands of trendy hand-picked color palettes
Gradient HuntA free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
Web GradientsA free website to find good CSS gradients
ColorBoxA free website to produce color set
CSS gradientA free website to make custom gradient and some examples of gradient
gradientaA pure css and jpg gradients
UI GradientsUI gradients color generator
Palette GeneratorGenerate new color palette with every spacebar press
Material Palettes1000+ Material Design palettes
GrabientGradient Selector
ShadeSwashQuickly generate shades of any color
BrandColorsThe biggest collection of official brand color codes
BRAND PALETTESLogo Color Codes and Palettes
Material Design Palette GeneratorGenerate theme and color palette Material Design-like
ColorateColor scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.
0to255A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.
Color BlenderA tool that shows the midpoint colors between two colors
Gradient ButtonsReady to use copy/paste gradient buttons
KhromaKhroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.
whocanuseA tool that brings attention and understanding to how color contrast can affect different people with visual impairments.
ColorableColor combination contrast tester
Color Hex PickerTool to get hex code along with name of the color.
SaruwakakunThe stunning color scheme for website & App Designs with previews
PalettonPaletton.com is a designer color tool designed for creating color combinations that work together well.
ColorzillaA powerful online Photoshop-like CSS gradient editor
CSS Gradient EditorYou may only need this tool for creating CSS gradient backgrounds and patterns.
Image Color PickerImage color picker and palette generator
CombineCOLORSColor mixing tool
Color LoversIt will show the color schemes which are popular in the outside world.
HTML CSS ColorFree online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc.
HEX Color CodesIt gets HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names.
CoolHue 2.0A free tool that shows different gradient examples in CSS and PNG format
Colors.lolInteresting color palettes generated by a Twitter bot, there are hex codes and descriptive names for each color.
colors.dopelySuper-fast and simple color palette generator, palettes can be saved and shared in seconds.
UIColor PickerA collection of UI Colors with hex codes available to be copied in just one click.
Color HexColor-hex gives information about colors including color models (RGB,HSL,HSV and CMYK) and generates a simple css code for the selected color.
FarbVeloA random color palette generator
Veranda ColorBrowse color palettes made by other designers, generate and submit your own
DuoDuo is a collection of colour combinations that I’ve curated from personal projects or that I’ve come across on the web.
Lospec Palette ListThe Lospec Palette List is a database of palettes for pixel art.
Palettte AppBuild smooth color schemes that flow from one color to another.
EggradientsGradient Background Colors with eggs.
GradientosFind and test gradients easily.
EncycolorpediaWebsite for referencing web colors. Color knowledge, Web colors, Hex color codes.
CromaA website for pick colors quickly from image or manually. It's color picker is easier to use.
Color DesignerA gradient generetor from one color.

Icons

Resources for Icons including png, svg and more

Website                           Description
UXWingWell Optimized, Free icons for commercial use
Shapedfonts Iconclub8000+ free icons
Feather IconsBeautiful, customizable open source icons
Tabler Icons470+ highly customizable open source SVG icons
XiconsSVG Vue/React components integrated from fluentui-system-icons, ionicons, etc. (Vue3, Vue2, React, SVG).
IconoirFree library of 900+ open source icons
Simple Icons1307 Free SVG icons for popular brands
Linear Icons1000+ Ultra crisp vector icons
Icons8Free icons, photos, vectors and tools
Flat IconThe largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
The Noun ProjectOver 2 Million curated icons, created by a global community
IconscoutFree Download Icons illustrations stock photos at one place
IconSear.chSearch engine with over 50,000 SVG icons indexed
Nucleo AppNucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid)
Icon-icons.comFree Icons PNG, ICO, ICNS and Vector file SVG
Bootstrap IconsFree Icons built for Bootstrap but they'll work in any project
Remix IconSimply Delightful Icon System
IconmonstrDiscover 4496+ free icons in 313 collections
Vivid.jsReady to use Free and Open Source SVG Icons Pack JavaScript Library.
IconfinderFree and premium vector icons in SVG, PNG, CSH and AI format
Lordicon50 free animated interactive icons
UseAnimationsFree Animated Icons in SVG and Json Format(for lottie)
css.gg700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API
IconBros7843+ free icons grouped in 182 collections
Material Design IconsAn icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
HeroiconsFree, open source icons from the creators of Tailwind CSS.
ZondiconsA set of free premium SVG icons for you to use on your digital products.
Endless IconsA website offering a number of free icons. Icons are tagged and also compressed into kits.
IcomoonBrowse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.
Eva IconsEva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.
CryptoiconsA set of 430 crypto and fiat currency icons. Completely free.
IkonateFully customizable & accessible vector icons
appiconQuickly generate app icons in different sizes for your IOS, macOS and Android projects
LineIcons2000+ Essential Line Icons for Designers and Developers
EvericonsEvericons is a big pack of over 460 free icons designed by Aleksey Popov.
SVG RepoDownload free SVG Vectors for commercial use.
ConvertioConvert PNG files to SVG online & free. (One of the services provided by it.)
CSS ICONIcon set made with pure css code, no dependencies, "grab and go" icons
Unified iconsThousands of icons, one unified framework. One library, over 40,000 vector icons.
System UIcons220+ icons in a growing collection.
IconParkTransform an SVG icon into multiple themes, and generate React icons,Vue icons,svg icons
Radix IconsA crisp set of 15×15 icons designed by the Modulz team. All icons available as individual react component,SVG and more.
EOS IconsA pixel-perfect, open source iconic font available as ligature and SVG.
IoniconsBeautifully crafted open source icons for use in web, iOS, Android, and desktop apps.
Phosphor IconsPhosphor is a flexible icon family for interfaces, diagrams, presentations
Teeny IconsTeenyIcons is a set icons in SVG format easy to use in html
LucideLucide is an open-source icon library, a fork of Feather Icons.
IconesIcon Explorer with Instant searching, powered by Iconify.
Shitty IconsCollection of Free icons.
IconspediaIconspedia is a website that contains a large collection of high quality free icons.
iconhubJust practical stunning icons for everyone
3DICONSBeautifully crafted open source 3D icons
IconsDbFree Custom Icons

Logos

Resources for Logos

Website                           Description
Instant Logo SearchThousands of free brands logos ( SVG - PNG )
LogoSear.chSearch engine with over 200,000 SVG logos indexed
SVGPorn1000+ high-quality SVG logos
Payment System LogosLogos for payment systems available in png and svg
Browser LogosHigh resolution web browser logos
VectorLogoZoneConsistently formatted SVG logos
World Vector LogoDownload vector logos of brands you love
Logo MakerCreate custom logos
Free Logo MakerFast, All-in-One Logo Generator
LOGOwineBrand Logos Free Download in SVG Vector & PNG File Format

Favicons

Resources for Favicons

Website                           Description
Favicon.ioGenerate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
FavicomaticGenerate favicons of all the sizes and formats as well as the HTML code needed to support every possible browser or device
Favicon GeneratorGenerate favicon ico files for your website
RealFaviconGeneratorGenerate icons for all platforms (Windows, iOS, Android)
FontIconGenerate favicons and images from Font Awesome icons
Favicon.ccDraw a favicon online and browse through a library of favicons made by other users
Maskable.app EditorGenerate maskable PWA icons based on your existing icon

Icon Fonts

Resources for Icon Fonts

Website                           Description
Font AwesomeThe web's most popular icon set and toolkit
Line AwesomeSwap in replacement of Font Awesome with modern line icons
Material IconsMaterial design icon library
IonIconsBeautifully crafted open source icons from Ionic team
Zurb Foundation IconsCustomizable Foundation icons
Fontisto IconsFontisto the iconic font and css toolkit · 616+ free icons
BoxiconsBoxicons is a free collection of carefully crafted open source icons
Icofont2100+ free icons to spice up your creative designs
Material PaletteFree to pick palettes, icons and colors for Material Design]
Material Design Iconic FontMaterial design icon font
Vscode CodiconsThe icon font from Visual Studio Code
DeviconDevicon is a set of icons representing programming languages, designing & development tools
PaymentFontA sleek web font for payment operators and methods. Featuring 116 icons
Weather IconsWeather Icons is the only icon font with 222 weather themed icons
Stroke 7202 thin stroke icons inspired by iOS 7
Jam Icons890+ handcrafted icons to make your web app awesome
Fontello200+ web icons where you can customize the names or codes of icons.
LineaLinea: Featuring 750+ Free Icons
UniconsA set of 1100+ Free line style icons available as web font, SVG icons, and as components for JS frameworks like React, Vue and React Native.
Mobirise IconsA free, open source set of 150 elegant, pixel-perfect linear icons, available as web icon font and SVG icons.
Hero IconsFree Open Source Svg Icon Library

Stock Photos

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

Website                           Description
PexelsFree stock photos shared by talented creators
UnsplashThe internet’s source of freely usable images
PixabayOver 1.7 million+ high-quality stock images and videos
MagdeleineGallery & free high-resolution photo everyday
PicspreeRoyalty free images, stock photos, illustrations, and vectors
BurstFree stock photos collections
GratisographyFree collection of free high-resolution pictures
Life of PixFree high-resolution photography
Stock SnapHundreds of high quality photos added weekly
MorguefileOver 350,000 free stock photos for commercial use
Kaboom PicsStock photography and color palettes. Good for product images
New Old StockStock vintage photos
Pic JumboGood collections of different types of photos
Public Domain PicturesPublic domain images of all types
Find A PhotoSearches multiple stock photo websites
StockvaultCategorized stock photos
PlaceholderA free image placeholder service for the web. You can specify image size and format
Realistic ShotsFree high-resolution stock photos
Negative SpaceHigh-Resolution Free Stock Photos
SkitterPhotoFree high-resolution photography
PicoGraphyGorgeous, High-Resolution, Free Photos
Wunder StockStunningly amazing free photos
PxHereFree Images & Free stock photos - PxHere
PiqselsRoyalty Free Stock Photos
FoodiesFeedFood photo stock
NappyA website offering Beautiful, high-res photos of black and brown people.
Generated PhotosUnique AI Generated model photos
ReshotUniquely free photos. Handpicked, non-stocky images.
Free ImagesFind and download free stock photos - all free for personal and commercial use
Lorem PicsumAn easy to use API to get beautiful placeholder images. Size and other parameters can be specified.
scienceimageAn image library specializing in science and nature images
Integration & Application Network Image LibraryFree images to provide scientists, resource managers, government agencies, community groups and graphics professionals with a resource for enhancing science communication.
SaxifragaFree nature images
Creative CommonsSearch for free images to reuse.
AllTheFreeStocka curated list of free stock images, audio and videos.
Lorem.space - Placeholder image generatorAPI for placeholder images but useful!
OpenverseOpenverse is a search engine for openly-licensed media

Stock Videos

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

Website                           Description
PexelsLargest library of free to use videos, donated by the community
PixabayLarge library of free to use videos, donated by the community similar to Pexels
Coverr.coBeautiful free stock video footage
VideezyFree HD stock footage & 4K videos
Mix KitStock video clips & music
Life Of VidsFree video clips and loops
VidevoFree and premium stock videos
LoopvidzFree To Use Cinema graphs Created With VIMAGE App
SplitShireBeautiful & exclusive free stock videos & photos

Stock Music & Sound Effects

Websites that offer free stock music and/or sound effects

Website                           Description
Free Stock MusicRoyalty free stock music for YouTube videos, podcasts, etc
BensoundDownload Royalty Free Music for free and use it in your project
MixkitFree music for your projects
FreesoundFree stock music and sounds
Free Music ArchiveCollaborative database of creative-commons licensed sound for musicians and sound lovers
MusopenAn online copyright free classical music library
PixabayFree music downloads for your project like Youtube videos, Music, Vlog, Film, Podcast etc.
UnminusFree Premium Music for Your Projects 🎁 Royalty Free. Cleared for YouTube.

Vectors & Clip Art

Free vectors, clipart, illustrations, patterns and more

Website                           Description
VecteezyFind and download free vector art
FreepikFree vectors, stock photos, PSD and icons
Free VectorsCommunity of vector lovers who share free vector graphics
PNGTreepng, backgrounds, templates, text effects
Vector4FreeFree vector graphics
FreebleVectors, patterns, mockups and more
LukaszadamFree Vector artworks
IlllustrationsBeautiful 100 Illustrations - png, svg
ClipartChoose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
Growwwkit illustrationsA set of 8 simple, black & white, stylish illustrations
trianglify.ioGenerate low-poly backgrounds, textures, and vectors
blobGenerate Blob shapes for Web and Flutter apps
HiClipartA community for designers to share & download transparent background PNG cliparts
Stories by FreepikA collection of free and customizable illustrations for projects
Black IllustrationsBeautiful illustrations of black people (free and premium)
DelesignA collection of free illustrations and more
Custom Shape DividersFree tool to make it easier for designers and developers to export a beautiful SVG shape divider
Servier Medical Art3000 free medical images to illustrate your publications and PowerPoint presentations
ClkerFree clip art you can use for anything you like
SVG waveA free, & customizable gradient 🌈 SVG wave generator for UI designs .
Heritage LibraryVintage Illustrations (vector and png)
ROBOHASHGenerate unique images from any text
TabbiedCreate and customize minimally generated patterns/artwork to use for background images, print and other projects.
HaikeiAn awesome multishape web app.