Please read `contributing guidelines` before submitting new resources.

Table of Contents

UI Graphics
Fonts
Colors
Icons
Logos
Favicons
Icon Fonts
Stock Photos
Stock Videos
Stock Music & Sound Effects
Vectors & Clip Art
Product & Image Mockups
HTML & CSS Templates
CSS Frameworks
CSS Methodologies
CSS Animations
Javascript Animation Libraries
Javascript Chart Libraries
UI Components & Kits
React UI Libraries
Vue UI Libraries
Angular UI Libraries
Svelte UI Libraries
React Native UI Libraries
Design Systems & Style Guides
Online Design Tools
Downloadable Design Software
Design Inspiration
Image Compression
Chrome Extensions
Firefox Extensions
AI Graphic Design Tools
Others

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
SVG sine waves	Export perfect sine waves as SVG for your front-end projects
UI Design Daily	Awesome UI Components of all types
100 Daily UI	Free Figma library of products, elements, and screens
Sketch App Sources	Sketch UIs, wireframes, icons and much more
Humaaans	Cool illustrations of people with the ability to mix and match
Paaatterns	Free collection of beautiful patterns for all vector formats
404 illustration	Free illustrations for 404 pages
Drawkit.io	Illustrations for designers and startups
Absurd.design	Free surrealist illustrations for designers and developers
Undraw.co	Open-source illustrations for any idea you can imagine and create
Manypixels.co	Monochromatic, Isometric high-quality illustrations
Open Peeps	Hand drawn illustration library
UI Space	Thousands of great UI freebies
Animations.co	Beautiful, customizable animated GIF icons
Uplabs	High-quality design resources (Free & Premium)
InvisionApp	Library of free, high-quality UI kits, icon packs, and mockups
Open Doodles	A Free Set of Sketchy Illustrations
Avataaars	Free sketch library of avatars illustrations by Pablo Stanley
Blush	Free customizable illustrations with Figma Plugin
Hero Patterns	A collection of repeatable SVG background patterns
BEAUBUS Patterns	A set of 150+ free SVG patterns (backgrounds)
IsoFlat	A Free collection of Isometric SVG graphic resources
IRA Design	An open-source gradient illustrations collection by creative tim.
Transparent Textures	A collection of transparent textures background patterns.
icons8.com/illustrations	Vector illustrations to class up your project
Patternico	Seamless Pattern Maker
Freellustrations	Free Background Images for awesome landing Pages
Pixeltrue Illustrations	Free Animated Illustrations
Abstract User Avatar API	API to create simple yet flexible user avatars from user names or emails
sketchvalley	Download free PNG, SVG or AI file .
PatternPad	Free and unlimited unique pattern designs.
Dimensions	Dimensions.com is an ongoing reference database of dimensioned drawings documenting the standard measurements and sizes of the everyday objects and spaces
Freebiesbug	Hand-picked resources for web designers and developers, constantly updated.
Flexiple	One new high-quality, open-source illustration each day.
Cool Text	Cool Text is a FREE graphics generator for web pages and anywhere else you need an impressive logo without a lot of design work
illustration kit	Premium open source illustrations added daily
Doodad Pattern Generator	Create unique, seamless, royalty-free patterns.
Pattern Monster	A simple online pattern generator to create repeatable SVG patterns
Exemplar	Free Avatar Library for Figma and Sketch
UIBundle	Thousands of Free Design Resources like UI Kits, Mockups, Illustrations, Icons, Fonts, 3D assets, Templates and more.
openby.design	Custom crafted free UI design resources, for personal and commercial projects. No attribution is required.
Design Stripe	Create beautiful illustrations, no design skills needed.
HOLA SVG!	An SVG playground to share SVG stuff.
symu.co	Free templates, UI kits, icon, PSD
Mesh Gradient	Generate & download beautiful mesh gradients.
CSS Shadow Gradients	Generate CSS Gradients For Shadows.
Creatica	Generate unique beautiful and unique Backgrounds and patterns.
Boring Avatars	SVG random, cutely avatars collections
Html to Design	Convert any website into fully editable Figma designs

↥ Back To Top

Fonts

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

Website	Description
Google Fonts	Library of around 1000 free licensed font families
DaFont	Archive of freely downloadable fonts
Use & Modify	Personal selection of beautiful, classy, punk, professional, incomplete, weird typefaces
1001 Free Fonts	I think the name speaks for itself 😏
Font Squirrel	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
Tiff	A type diff tool that visually contrasts the differences between two fonts
TypeKit Practice	Learn about typography practices
Fontjoy	Generate font pairing in one click
Golden Ratio	Golden Ratio Typography Calculator
FontGet	Has a variety of fonts available to download and sorted neatly with tags
FontPair	Helps you pair Google Fonts together
Font Space	A designer-centered free font website that has quick customizable previews
Abstract Fonts	Fonts free for personal and commercial use
Free Typography	A list of high quality fonts
Leon Sans	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	Free curated fonts
Befonts	High quality fonts for free
Arabic fonts	Arabic fonts for free
FontDrop	Simple and easy way to view the contents of font files
Open Foundry	FREE platform for curated open-source typefaces
Glyphter	Upload your own SVGS and turn them into font files. Useful if you want a smaller library loaded
Google Webfonts Helper	A Hassle-Free Way to Self-Host Google Fonts
Rough Font Awesome	When RoughJS meets Font Awesome
FFonts	Stylish fonts for free
Malayalam Fonts	Malayalam fonts for free which are maintained by Swathanthra Malayalam Computing(SMC)
Dev Fonts	Find and use the coding fonts for free
Font M	Free font you can download for material coding and design
W Fonts	Download Free fonts
Modern fluid typography editor	Fluid typography is a modern way of approaching responsive typography.
UrbanFonts	A collection of over 8000 free fonts and dingbats
Typespiration	Inspirational font combinations and color palettes
Fontsource	Self-host Open Source fonts in neatly bundled NPM packages.
FontBolt	Discover and generate your favorite fonts from pop culture.
Fontshare	Fontshare is a free fonts service from the Indian Type Foundry (ITF), making quality fonts accessible to all.

↥ Back To Top

Colors

Websites and resources that help with choices related to colors

Website	Description
Color Brewer 2	The original color palette generator, also supporting color blindness. Probably the scientifically best option. Also probably not the prettiest.
Huetone	A tool to create accessible color systems.
Colormind.io	Color palette generator
ColorCurves.app	Color palette generator that uses curves to generate color palettes
ColorGradient	A free tool to create simple and complex CSS Gradients visually
Coolors	Create the perfect palette or get inspired by thousands of beautiful color schemes
UI Colors	Tailwind CSS color palette generator
HTML Color Codes	Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names
Colors & Fonts	A curated library of colors, fonts and resources
Palette List	Pick 2 colors you like and the tool generates thousands of palettes for you.
Google Material Color Tool	Official Google Material Color Palette Tool
Material Palette	Free to pick palettes, icons and colors for Material Design
ColorSpace	Generate nice color palettes from one color
FlatUIColors	Beautiful set of color palettes in various flavors
Adobe Color	Create color palettes, extract gradients from images, etc.
Colorsinspo	All-in-one resource for finding everything about colors
ColorsWall	Place to store your color palettes and generate palette in one click
Happyhues	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	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	A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
Web Gradients	A free website to find good CSS gradients
ColorBox	A free website to produce color set
CSS gradient	A free website to make custom gradient and some examples of gradient
gradienta	A pure css and jpg gradients
UI Gradients	UI gradients color generator
Palette Generator	Generate new color palette with every spacebar press
Material Palettes	1000+ Material Design palettes
Grabient	Gradient Selector
ShadeSwash	Quickly generate shades of any color
BrandColors	The biggest collection of official brand color codes
BRAND PALETTES	Logo Color Codes and Palettes
Material Design Palette Generator	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.
Color Blender	A tool that shows the midpoint colors between two colors
Gradient Buttons	Ready to use copy/paste gradient buttons
Khroma	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
CSS Gradient Editor	You may only need this tool for creating CSS gradient backgrounds and patterns.
Image Color Picker	Image color picker and palette generator
CombineCOLORS	Color mixing tool
Color Lovers	It will show the color schemes which are popular in the outside world.
HTML CSS Color	Free online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc.
HEX Color Codes	It gets HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names.
CoolHue 2.0	A free tool that shows different gradient examples in CSS and PNG format
Colors.lol	Interesting color palettes generated by a Twitter bot, there are hex codes and descriptive names for each color.
colors.dopely	Super-fast and simple color palette generator, palettes can be saved and shared in seconds.
UIColor Picker	A collection of UI Colors with hex codes available to be copied in just one click.
Color Hex	Color-hex gives information about colors including color models (RGB,HSL,HSV and CMYK) and generates a simple css code for the selected color.
FarbVelo	A random color palette generator
Veranda Color	Browse color palettes made by other designers, generate and submit your own
Duo	Duo is a collection of colour combinations that I’ve curated from personal projects or that I’ve come across on the web.
Lospec Palette List	The Lospec Palette List is a database of palettes for pixel art.
Palettte App	Build smooth color schemes that flow from one color to another.
Eggradients	Gradient Background Colors with eggs.
Gradientos	Find and test gradients easily.
Encycolorpedia	Website for referencing web colors. Color knowledge, Web colors, Hex color codes.
Croma	A website for pick colors quickly from image or manually. It's color picker is easier to use.
Color Designer	A gradient generetor from one color.
Duotone	Find beautiful free duotone images to use in any project, or make custom duotone images by uploading your own image and applying a duotone effect in seconds.
coolbackgrounds generator	Explore a beautifully curated selection of cool backgrounds that you can add to blogs, websites.
Color Shades Generator	We can quickly generate color shades of our favorite colors or any colors, to create templates or css components with multiple color shades and more useful tools available on same site
Huemint	Huemint uses machine learning to create unique color schemes for your brand, website or graphic

↥ Back To Top

Icons

Resources for Icons including png, svg and more

Website	Description
Circum Icons	Consistant open source icons as SVG for React, Vue and Svelte
UXWing	Well Optimized, Free icons for commercial use
Shapedfonts Iconclub	8000+ free icons
Feather Icons	Beautiful, customizable open source icons
Tabler Icons	3500+ highly customizable open source SVG icons with React, Preact, Vue, Svelte and SolidJS support
Xicons	SVG Vue/React components integrated from fluentui-system-icons, ionicons, etc. (Vue3, Vue2, React, SVG).
Iconoir	Free library of 900+ open source icons
Simple Icons	1307 Free SVG icons for popular brands
Linear Icons	1000+ Ultra crisp vector icons
Icons8	Free icons, photos, vectors and tools
Flat Icon	The largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
The Noun Project	Over 2 Million curated icons, created by a global community
Iconscout	Free Download Icons illustrations stock photos at one place
IconSear.ch	Search engine with over 50,000 SVG icons indexed
Nucleo App	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	Free Icons PNG, ICO, ICNS and Vector file SVG
Bootstrap Icons	Free Icons built for Bootstrap but they'll work in any project
Remix Icon	Simply Delightful Icon System
Iconmonstr	Discover 4496+ free icons in 313 collections
Vivid.js	Ready to use Free and Open Source SVG Icons Pack JavaScript Library.
Iconfinder	Free and premium vector icons in SVG, PNG, CSH and AI format
Lordicon	50 free animated interactive icons
UseAnimations	Free Animated Icons in SVG and Json Format(for lottie)
css.gg	700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API
IconBros	7843+ free icons grouped in 182 collections
Material Design Icons	An icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
Heroicons	Free, open source icons from the creators of Tailwind CSS.
Zondicons	A set of free premium SVG icons for you to use on your digital products.
Endless Icons	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.
Cryptoicons	A set of 430 crypto and fiat currency icons. Completely free.
Ikonate	Fully customizable & accessible vector icons
appicon	Quickly generate app icons in different sizes for your IOS, macOS and Android projects
LineIcons	2000+ Essential Line Icons for Designers and Developers
Evericons	Evericons is a big pack of over 460 free icons designed by Aleksey Popov.
SVG Repo	Download free SVG Vectors for commercial use.
Convertio	Convert PNG files to SVG online & free. (One of the services provided by it.)
CSS ICON	Icon set made with pure css code, no dependencies, "grab and go" icons
Unified icons	Thousands of icons, one unified framework. One library, over 40,000 vector icons.
System UIcons	220+ icons in a growing collection.
IconPark	Transform an SVG icon into multiple themes, and generate React icons，Vue icons，svg icons
Radix Icons	A crisp set of 15×15 icons designed by the Modulz team. All icons available as individual react component,SVG and more.
EOS Icons	A pixel-perfect, open source iconic font available as ligature and SVG.
Ionicons	Beautifully crafted open source icons for use in web, iOS, Android, and desktop apps.
Phosphor Icons	Phosphor is a flexible icon family for interfaces, diagrams, presentations
Teeny Icons	TeenyIcons is a set icons in SVG format easy to use in html
Lucide	Lucide is an open-source icon library, a fork of Feather Icons.
Icones	Icon Explorer with Instant searching, powered by Iconify.
Shitty Icons	Collection of Free icons.
Iconspedia	Iconspedia is a website that contains a large collection of high quality free icons.
iconhub	Just practical stunning icons for everyone
3DICONS	Beautifully crafted open source 3D icons
IconsDb	Free Custom Icons
Emoji Guide	The collection of 3300 emojis with their HTML codes for easy use.
Unicorn Icons	100+ customizable playful animated icons. Available in JSON and SVG format.
Sargam Icons	A collection of 275+ open-source icons available for Figma, SVGs, and React.
Icon buddy	A collection of 100K+ open-source SVG icons, fully customizable for designers and developers.

↥ Back To Top

Logos

Resources for Logos

Website	Description
LogoSear.ch	Search engine with over 200,000 SVG logos indexed
SVGPorn	1000+ high-quality SVG logos
Payment System Logos	Logos for payment systems available in png and svg
Browser Logos	High resolution web browser logos
VectorLogoZone	Consistently formatted SVG logos
World Vector Logo	Download vector logos of brands you love
Logo Maker	Create custom logos
Free Logo Maker	Fast, All-in-One Logo Generator
LOGOwine	Brand Logos Free Download in SVG Vector & PNG File Format

↥ Back To Top

Favicons

Resources for Favicons

Website	Description
Favicon.io	Generate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
Favicomatic	Generate favicons of all the sizes and formats as well as the HTML code needed to support every possible browser or device
Favicon Generator	Generate favicon ico files for your website
RealFaviconGenerator	Generate icons for all platforms (Windows, iOS, Android)
FontIcon	Generate favicons and images from Font Awesome icons
Favicon.cc	Draw a favicon online and browse through a library of favicons made by other users
Maskable.app Editor	Generate maskable PWA icons based on your existing icon
Favicon Generator	Generate website's favicon assets. SVG, maskable, image minified supported. Pure frontend. No privacy risk. Fast.

↥ Back To Top

Icon Fonts

Resources for Icon Fonts

Website	Description
Font Awesome	The web's most popular icon set and toolkit
Line Awesome	Swap in replacement of Font Awesome with modern line icons
Material Icons	Material design icon library
IonIcons	Beautifully crafted open source icons from Ionic team
Zurb Foundation Icons	Customizable Foundation icons
Fontisto Icons	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	The icon font from Visual Studio Code
Devicon	Devicon is a set of icons representing programming languages, designing & development tools
PaymentFont	A sleek web font 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
Fontello	200+ web icons where you can customize the names or codes of icons.
Linea	Linea: Featuring 750+ Free Icons
Unicons	A 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 Icons	A free, open source set of 150 elegant, pixel-perfect linear icons, available as web icon font and SVG icons.
Hero Icons	Free Open Source Svg Icon Library
React Icons	An Open Source and free Svg Icon Library, it is a collection of your favorite icon libraries like Font Awesome and Material Icons to provide you with a wide range of SVG icons to choose from.

↥ Back To Top

Stock Photos

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

Website	Description
Pexels	Free stock photos shared by talented creators
Unsplash	The internet’s source of freely usable images
Pixabay	Over 1.7 million+ high-quality stock images and videos
Magdeleine	Gallery & free high-resolution photo everyday
Picspree	Royalty free images, stock photos, illustrations, and vectors
Burst	Free stock photos collections
Gratisography	Free collection of free high-resolution pictures
Life of Pix	Free high-resolution photography
Stock Snap	Hundreds of high quality photos added weekly
Morguefile	Over 350,000 free stock photos for commercial use
Kaboom Pics	Stock photography and color palettes. Good for product images
New Old Stock	Stock vintage photos
Pic Jumbo	Good collections of different types of photos
Public Domain Pictures	Public domain images of all types
Find A Photo	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	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	Stunningly amazing free photos
PxHere	Free Images & Free stock photos - PxHere
Piqsels	Royalty Free Stock Photos
FoodiesFeed	Food photo stock
Nappy	A website offering Beautiful, high-res photos of black and brown people.
Generated Photos	Unique AI Generated model photos
Reshot	Uniquely free photos. Handpicked, non-stocky images.
Free Images	Find and download free stock photos - all free for personal and commercial use
Lorem Picsum	An easy to use API to get beautiful placeholder images. Size and other parameters can be specified.
scienceimage	An image library specializing in science and nature images
Integration & Application Network Image Library	Free images to provide scientists, resource managers, government agencies, community groups and graphics professionals with a resource for enhancing science communication.
Saxifraga	Free nature images
Creative Commons	Search for free images to reuse.
AllTheFreeStock	a curated list of free stock images, audio and videos.
Lorem.space - Placeholder image generator	API for placeholder images but useful!
Openverse	Openverse is a search engine for openly-licensed media
ISO Republic	Get Thousands of Free High-Resolution Stock CC0 Photos

↥ Back To Top

Stock Videos

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

Website	Description
Pexels	Largest library of free to use videos, donated by the community
Pixabay	Large library of free to use videos, donated by the community similar to Pexels
Coverr.co	Beautiful free stock video footage
Videezy	Free HD stock footage & 4K videos
Mix Kit	Stock video clips & music
Life Of Vids	Free video clips and loops
Videvo	Free and premium stock videos
Loopvidz	Free To Use Cinema graphs Created With VIMAGE App
SplitShire	Beautiful & exclusive free stock videos & photos
Free-Stock-Video	Free Footage Stock Videos

↥ Back To Top

Stock Music & Sound Effects

Websites that offer free stock music and/or sound effects

Website	Description
YouTube Studio Audio Library	Royalty-free audio library for downloadable music and sound effects. Cleared for YouTube monetization.
Free Stock Music	Royalty free stock music for YouTube videos, podcasts, etc
Bensound	Download Royalty Free Music for free and use it in your project
Mixkit	Free music for your projects
Freesound	Free stock music and sounds
Free Music Archive	Collaborative database of creative-commons licensed sound for musicians and sound lovers
Musopen	An online copyright free classical music library
Pixabay	Free music downloads for your project like Youtube videos, Music, Vlog, Film, Podcast etc.
Unminus	Free Premium Music for Your Projects 🎁 Royalty Free. Cleared for YouTube.

↥ Back To Top

Vectors & Clip Art

Free vectors, clipart, illustrations, patterns and more

Website	Description
Vecteezy	Find and download free vector art
Freepik	Free vectors, stock photos, PSD and icons
Free Vectors	Community of vector lovers who share free vector graphics
PNGTree	png, backgrounds, templates, text effects
Vector4Free	Free vector graphics
Freeble	Vectors, patterns, mockups and more
Lukaszadam	Free Vector artworks
Illlustrations	Beautiful 100 Illustrations - png, svg
Clipart	Choose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
Growwwkit illustrations	A set of 8 simple, black & white, stylish illustrations
trianglify.io	Generate low-poly backgrounds, textures, and vectors
blob	Generate Blob shapes for Web and Flutter apps
HiClipart	A community for designers to share & download transparent background PNG cliparts
Stories by Freepik	A collection of free and customizable illustrations for projects
Black Illustrations	Beautiful illustrations of black people (free and premium)
Delesign	A collection of free illustrations and more
Custom Shape Dividers	Free tool to make it easier for designers and developers to export a beautiful SVG shape divider
Servier Medical Art	3000 free medical images to illustrate your publications and PowerPoint presentations
Clker	Free clip art you can use for anything you like
SVG wave	A free, & customizable gradient 🌈 SVG wave generator for UI designs .
BGjar	Free svg background generator for your websites, blogs and app.
Heritage Library	Vintage Illustrations (vector and png)
ROBOHASH	Generate unique images from any text
Tabbied	Create and customize minimally generated patterns/artwork to use for background images, print and other projects.
Haikei	An awesome multishape web app.
Vector	Awesome website for all kinds of Moroccan vectors.
Heazy	Unique vector assets within seconds.

↥ Back To Top

Product & Image Mockups

Create mockups of devices and other products

Website	Description
MockCity	Bulk generate mockups from PSD templates by automatically placing images in SmartObjects. The visual editor allows you to change SmartObject parameters and see an updated mockup preview in realtime.
Smart Mockups	Create stunning product mockups (free & premium)
Media Modifier	beautiful design mockups service for your products (free & premium)
Shot Snap	Create beautiful device mockup images for your app or website design
Screely	Instantly turn your screenshot into a mockup
Screenshot.rocks	Create beautiful browser & mobile mockups in seconds
Screen Peak	Create a mockup from a URL
Mockup World	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	Generate 3D mockups right in your browser.
Mockuphone	100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TV
Device Shots	Create high-resolution device mockups for social media, for free
Clean Mock	Create stunning mockups using latest device frames like iPhone X & custom backgrounds that make your mobile or website design standout, right from your browser quickly & for free.
Mock.Video	Instantly create mockups by adding a device frame to your videos.
MockupBro	Create product mockups with online mockup generator! Just choose a mockup, upload your design and download your image without a watermark.
Animockup	Create animated mockups in the browser 🔥.
Pika	Instantly create browser mockups and beautiful images for marketing, blog post and more
Lunacy	Create mockups from scratch for free

↥ Back To Top

HTML & CSS Templates

Websites that offer free beautiful website templates and themes of all types

Website	Description
HTML5Up	Very modern, unique responsive HTML5/CSS3 themes
Templatemo	Minimal, resume, gallery themes and more
FreeHTML5	Free & premium HTML5 and Bootstrap themes
StyleShout	Brilliantly crafted free website templates
Start Bootstrap	Bootstrap starter themes
Zerotheme	HTML5, Bootstrap, Prestashop templates
HTML5xCSS3	Collection of wonderful templates in different categories
ThemeWagon	Collection of HTML5 Bootstrap templates from different categories
Colorlib	Almost any category of theme you can think of
Free CSS	Huge collection of free templates
Hubspot	Templates, infographics, banners and much more
Mobirise	Great looking HTML5/CSS3 templates
Bootswatch	Free themes for Bootstrap
Onepagelove	One-page websites, templates and resources
Themes For App	Free Bootstrap themes and landing pages
BootstrapTaste	Premium & Free Bootstrap Templates
BootstrapMade	Elegant, clean and beautiful free templates using Bootstrap.
W3Layouts	W3Layouts: 3784+ Free Website Templates for 2020
Tooplate	Tooplate: Free HTML Templates for everyone!
Cruip	Fully coded HTML templates to help you easily build your startup landing page without hassles.
UIdeck	Free Landing Page Templates and Bootstrap Themes
Splawr	Free web templates to kickstart your idea!
W3css_templates	Some responsive W3.CSS website templates for you to use.
All-Free-Download	Download free-website-templates
mashup-template	HTML5/CSS3 Free Templates
Sneat Bootstrap 5 HTML Admin Template	Open-source & Easy to us Bootstrap 5 HTML Admin Template with Elegant Design & Unique Layout.
HTMLrev	Free beautiful HTML5 templates and landing pages
Horizon UI	Trendiest open source Admin Template for React
KeenThemes	Free and Pro Html/Css3, Bootstrap5, Vue, React, Laravel templates

↥ Back To Top

CSS Frameworks

CSS/UI frameworks to help build great looking websites and applications

Website	Description
Tailwind CSS	Low level, utility-first framework
Bootstrap	Popular UI framework with tons of components that use both CSS and JS
Materialize	A modern responsive front-end framework based on Material Design
Material Design Lite	Light framework based on Material Design. No JS dependency
Bulma	Modern CSS framework with no JS
Skeleton	Extremely light framework for basic UI elements
Uniform CSS	Fully configurable utility generator and CSS framework built entirely in Sass
Semantic UI	Empowers designers and developers by creating a shared vocabulary for UI
Fomantic UI	A community fork of Semantic-UI
Foundation	Mobile first framework with clean markup
Pure CSS	A set of small, responsive CSS modules
UIKit	Lightweight and modular front-end framework
Susy	Lightweight, grid-layout engine for Sass
Milligram.io	Minimalist CSS framework
Vanilla Framework	Simple, extensible CSS framework written in Sass
Spectre CSS	Lightweight, modern CSS framework
Picnic CSS	Lightweight and beautiful library
Wing	A beautiful CSS framework designed for minimalists
Chota	A micro (~3kb) CSS framework
Blueprint CSS	A lightweight layout library for building great responsive mobile first UIs that work everywhere
W3.CSS	A modern CSS framework with support for desktop, tablet, and mobile design by default. Designed to be independent of jQuery or any other JavaScript library
98.css	A design system for building faithful recreations of old UIs
NES CSS	NES-style CSS Framework
Shoelace.css	Lightweight, forward-thinking CSS library built with future CSS syntax
MVP.css	A minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you're done
Blaze.css	Open source modular CSS toolkit providing great structure for building websites quickly
Turret CSS	Turret CSS is a styles framework for development of responsive websites.
Cutestrap	A strong, independent CSS Framework.
XP.css	XP.css is an extension of 98.css. A CSS library for building interfaces that look like old UIs.
Framework7	Framework7 - is a free and open source framework to develop mobile, desktop or web apps with native look and feel.
Hint.css	A pure CSS tooltip library for your lovely websites.
imagehover.io	Pure CSS Image Hover Effect Library
mini.css	A minimal, responsive, style-agnostic CSS framework
Tachyons	Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible.
Material Bootstrap	Material Design with Bootstrap
Ivory	A modern CSS framework for developing powerful web interfaces faster and easier
Halfmoon UI	A responsive and lightweight framework, designed for quickly building beautiful dashboards and product pages.
Metro 4	Create your site quickly and effectively with Metro 4. impressive components library built on html, css, javascript.
css-doodle	A web component for drawing patterns with CSS
latex.css	Make your website look like a LaTeX document
Paper CSS	Front-end printing solution
Windi CSS	Next generation compiler for Tailwind CSS
Cirrus CSS	A component and utility centric SCSS framework designed for rapid prototyping.
Gutenberg	Modern framework to print the web correctly.
lit	World's smallest responsive fire css framework (395 bytes).
Arwes	Arwes is a web framework to build user interfaces based on futuristic science fiction designs, animations, and sound effects.
Bojler	Bojler is an email framework for developing responsive and lightweight email templates that will render correctly across each of the most popular email clients.
Tacit	Primitive CSS Framework for dummies, without classes.
Terminal CSS	A modern and minimal CSS framework for terminal lovers.
Sakura	A minimal classless css framework / theme.
PSone	PS1 style CSS Framework, inspired by NES.css.
Marx	Marx is the classless CSS reset to be used in any projects (namely small ones).
Tufte	Style your webpage like Edward Tufte’s handouts.
Axentix	Axentix is an open source Framework based on CSS Grid using HTML, CSS and JS.
Raster Simple Grid System	Minimal and straight-forward CSS grid system utilizing descriptive HTML rather than semantic CSS.
flowrift	Flowrift is a library made of beautifully designed Tailwind CSS UI blocks.
twind	The smallest, fastest, most feature complete tailwind-in-js solution in existence
Pico.css	Elegant styles for all natives HTML elements without .classes and dark mode automatically enabled.
clay.css	Extensible and configurable micro CSS util class and SASS mixin for adding claymorphism styles to your components.
BeerCSS	Build Material Design interfaces in record time, without stress for devs 🍻. The first CSS framework that implements Material Design 3.
UnoCSS	UnoCSS is the instant atomic CSS engine, that is designed to be flexible and extensible. The core is un-opinionated, and all the CSS utilities are provided via presets.
Neptune CSS	Neptune CSS is a lightweight CSS framework. Use it to develop your websites faster.
StyleX	StyleX is a simple, easy-to-use JavaScript syntax and compiler for styling web apps.

↥ Back To Top

CSS Methodologies

CSS methodologies to help write modular, reusable and scalable code

Website	Description
OOCSS	OOCSS concepts help us write components that are flexible, modular and interchangeable.
Atomic CSS	Atomic CSS is the approach to CSS architecture that favors small, single-purpose classes with names based on visual function.
BEM	Block Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development.
SMACSS	SMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process.
CUBE	CUBE CSS is a CSS methodology that’s orientated towards simplicity, pragmatism and consistency.

↥ Back To Top

CSS Animations

CSS animations to build awesome animations for websites and applications

Website	Description
Animate.css	Just-add-water CSS animations
Bounce.js	Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations
Anime.js	Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes and JavaScript Objects
Magic Animations	Animations has been one of the most impressive animation libraries available
Zdog	Round, flat, designer-friendly pseudo-3D engine for canvas & SVG
CSShake	CSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web page
Hover.css	Hover.css is a CSS animation library designed for use with buttons and other UI elements in your website
AniJS	AniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structure
Animista	CSS Animations On Demand
Tachyons-animate	Tachyons itself is an atomic CSS library with a ton of utility classes for essentially designing anything by adding classes to what you need
Sequence.js	Sequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications
Infinite	These animations, like rotations and pulses, that are specifically designed to run and repeat forever
OBNOXIOUS.CSS	Animations for the strong of heart, and weak of mind
MOTION UI	A Sass library for creating flexible CSS transitions and animations
Keyframes.app	A graphical user interface for generating custom CSS keyframe animations
thoughtbot	CSS Transitions and Transformations for Beginners
SVG Artista	A useful tool to animate stroke and fill properties in SVG images with plain CSS code
AnimXYZ	AnimXYZ helps you create, customize, and compose animations for your website. Built for Vue, React, SCSS, and CSS
Whirl	CSS loading animations with minimal effort!
Hamburgers	Hamburgers is a collection of tasty CSS-animated hamburger icons. Also included is the source as a Sass library. It’s modular and customizable, so cook up your own hamburger.
CSS Loaders & Spinners	This is a library having a collection of different types of CSS loaders, spinners
Motion One	A new animation library, built on the Web Animations API for the smallest filesize and the fastest performance.
pocoloco	Generate dynamic backgrounds for your website
AniX	Super easy and lightweight css animation library.
AOS	Animate On Scroll Library.
Animatopy	Just-add-water CSS animations snippets

↥ Back To Top

Javascript Animation Libraries

javascript animations libraries to build awesome animations for websites and applications

Website	Description
Greensock	A JavaScript library for building high-performance animations that work in every major browser
Velocity.js	Velocity is a lightweight animation engine with the same API as jQuery's $.animate()
lax.js	Simple & light weight vanilla javascript plugin to create smooth & beautiful animations when you scroll!
Rellax.js	A buttery smooth, super lightweight, vanilla javascript parallax library
three.js	An easy to use, lightweight, 3D library with a default WebGL renderer.
Atropos	Atropos is a lightweight, free and open-source JavaScript library to create stunning touch-friendly 3D parallax hover effects.
wow.js	Reveal Animations When You Scroll.
chocolat.js	Free lightbox plugin.
Animate On Scroll	Animate on scroll library to reveal animations when You scroll.
Tilt.js	A tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery.
Roughnotation	Rough Notation is a small JavaScript library to create and animate annotations on a web page
tsParticles	A lightweight library for creating particles, an improved version of the abandoned and obsolete particles.js
Particles.js	A lightweight JavaScript library for creating particles
mo.js	The motion graphics toolbelt for the web
Lightbox2	A small JS library to overlay images on top of the current page.
Slick	Fully responsive carousel
barba.js	Create fluid and smooth transitions between your website’s pages.
Locomotive Scroll	A simple scroll library that provides detection of elements in viewport & smooth scrolling with parallax.
Owl carousel	Free responsive jQuery carousel
Swiperjs	Free, Open Source, Modern Slider without jQuery. Available for Vanilla JS and all modern frameworks like React, Vue, Angular etc.
Splide	Free, pure JS library for carousels and sliders
Simple Parallax	The easiest way to get a parallax effect with javascript
KUTE.js	KUTE.js is a JavaScript animation engine for modern browsers.
Granim.js	Create fluid and interactive gradient animations with this small javascript library.
Popmotion	Simple animation libraries for delightful user interfaces.
Vivus	Vivus is a lightweight JavaScript class (with no dependencies) that allows you to animate SVGs, giving them the appearence of being drawn.
Typed.js	A JavaScript Typing Animation Library.
Progress Bar.js	Responsive and slick progress bars with animated SVG paths.
Midnight.js	Midnight.js lets you switch fixed headers on the fly
Tingle.js	Tingle is a simple modal plugin written in pure JavaScript
Theatre.js	Theatre.js is a JavaScript animation library with a GUI. It animates the DOM, WebGL, and any other JavaScript variable.
splidejs	Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.
nice-waves	Beautiful animated waves
Vanta.js	Animated website backgrounds in a few lines of code.
Splitting.js	Splitting creates elements and adds CSS variables to unlock amazing possibilities for animating text, grids, and more!

↥ Back To Top

Javascript Chart Libraries

Libraries that help developers visualize data into charts

Website	Description
ChartJS	Simple yet flexible JavaScript charting for designers & developers
FrappeJS	Includes Green squares grid like in GitHub, and other charts to use.
G2Plot	G2Plot is an interactive and responsive charting library based on the grammar of graphics.
Google Charts	Get the experience from Google to create similar charts that Google uses.
Data Driven Documents (D3)	Bind complicated and massive data to interactive graphs.
ApexCharts.Js	Modern & Interactive Open-source Charts
Chartist	Simple responsive charts
Vizzu	Vizzu - a free, open-source Javascript library for building animated charts, data stories, and interactive explorers.
AntV	Ant Design Charts, free JS Charts library for dynamic data with excellent documentation
Nivo	Nivo provides supercharged React components to easily build dataviz apps, it's built on top of d3. Also comes with server side rendering ability and fully declarative charts.
Echarts	An Open Source JavaScript Visualization Library with declarative syntax for Rapid Construction of Web-based Visualization

↥ Back To Top

UI Components & Kits

Not quite "frameworks", but tools for creating user interfaces with components or UI kits

Website	Description
Bit	Provides a huge library of reuseable UI Components for React, Angular, Vue, React Native. Also can be used for sharing UI Components among other team members
UILang	A minimal, UI-focused programming language for web designers
Medialoot CSS Components	Calendars, price grids and other UI components
Froala Design Blocks	Over 170 responsive design blocks ready to be used in your web or mobile apps
Flowbite	Open-source library of Tailwind CSS components
daisyUI	Tailwind CSS Components
Mui Treasury	An open-source project that provides a collection of ready-to-use components based on Material-UI.
Material Design For Bootstrap	Open source toolkit for building material design with Bootstrap
Photonkit	Desktop UI library for Electron
Flat UI	Minimal free user interface kit
Shards	A free and modern UI toolkit for web makers based on Bootstrap
Themesberg	Free and open-source website themes, templates, and UI kits based on Bootstrap and React
Creative Tim	All types of UI libraries and kits including JS frameworks like React
Brumm Shadow Maker	An online tool to make css shadows
AdminLTE	Best open source admin dashboard & control panel theme
SpinKit	Simple CSS Spinners
Epic Spinners	CSS spinners collection with Vue.js integration.
Loading.io	Online service provider for creating simple animations, spinners, progress bar and more
Moving Letters	Animated Text with JavaScript and anime.js
CSS Layout	A collection of popular web layouts and patterns in pure CSS
CSS Grid Generator	An open-source project that allow users to quickly create dynamic layout based on CSS Grid.
Codyhouse	Kick-start your web projects with CodyHouse's front-end framework and library of accessible HTML, CSS, JavaScript components
Tailwind Starter Kit	Tailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open Source
Tailwindtoolbox	Open source starter templates and components, a plugins directory and useful tools/utilities to kick start your Tailwind CSS project.
tailwindcomponents	A free repository for community components using TailwindCSS
sweetalert	SweetAlert makes popup messages easy and pretty.
sweetalert2	A beautiful, responsive, customizable, accessible replacement for javascript's popup boxes
tailblocks	Open source ready-to-use Tailwind CSS components.
Soft Components	A set of framework-agnostic web components based on neumorphic design.
Fast	An interface system that can be used with modern Web Frameworks such as React, Vue and Angular.
LottieFiles	Interactive animations in many formats like json,gif and mp4, libraries and plugins for Web & Mobile .
Kutty	A set of accessible and reusable prebuilt Tailwind components that are commonly used in web applications.
Tailwind Templates	A free collection of Tailwindcss Templates - tailwind components for rapid UI development.
Stitches	An HTML template generator using functional css.
Meraki UI Components	Beautiful Tailwindcss components that support RTL languages & fully responsive based on Flexbox & CSS Grid.
Daemonites Material Design For Bootstrap	Daemonite's Material UI is a cross-platform and fully responsive front-end interface based on Google Material Design developed using Bootstrap 4
Stitches	CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
Headless UI	Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
Styled components	Build beautifully UI Components, for your applications & websites.
Figma Bootstrap 5 UI Kit	UI Kit comprising 300+ organized Bootstrap 5 components built with atomic design system & auto layout.
Notiflix	JavaScript library for client-side non-blocking notifications, popup boxes, loading indicators, and more that makes your web projects much better
CoreUI	Bootstrap Admin Dashboard Template & UI Components Library
AgnosticUI	Accessible React component primitives that also work with Vue 3, Svelte, and Angular
SVGR	SVGR is an universal tool to transform a raw SVG into a ready-to-use React components. Available online, in CLI, Node.js, as a webpack/rollup/parcel plugin...
uiverse	Hundreds Open-Source UI elements, made with HTML & CSS. Anyone can contribute. Includes buttons, checkboxes, spinners, cards, inputs and more.
HyperUI	Free open source Tailwind CSS components for marketing and ecommerce websites, as well as application UI.
Flowbite Admin Dashboard	Free and open-source admin dashboard template built with Tailwind CSS and Flowbite featuring 15 examples pages, charts, widgets, and dark mode.
Wicked Blocks	A free collection of Tailwind blocks & components
Mamba UI	Mamba UI is a free, open-source collection of UI components and templates based on Tailwind CSS.
Kitwind	Fully responsive UI kits, built with Tailwind CSS.
DevUI	Free and Open-Source UI Components for Maximum Productivity.
Tail-Kit	Tail-kit gives you access to over 250 free components and free templates, based on Tailwind CSS 3.0.
Float UI	Free and open-source UI components and website templates using Tailwind CSS
Konsta UI	Pixel perfect mobile UI components built with Tailwind CSS
React Native Gifted Chat	A chat UI component that offers a ready-to-use chat interface with features like message bubbles, input toolbar, and more.
Wind UI	Expertly made, responsive, accessible components in React and HTML ready to be used on your website or app.
Sonner	An opinionated toast component for React.
Pines	Pines is a library of animations, sliders, tooltips, accordions, modals, and more! It's a set of UI elements that can be copy and pasted into any Alpine and Tailwind projects.
Kuma UI	With Kuma UI's headless, zero-runtime UI components, build top-performing websites effortlessly, while enjoying the best developer experience. Say hello to the future of CSS-in-JS.
Preline UI	Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.

↥ Back To Top

React UI Libraries

UI and component libraries for the React JavaScript framework

Website	Description
Material UI	React components for faster and easier web development, based on Material Design
Chakra UI	Build accessible React apps & websites with speed. Openchakra
React Bootstrap	Bootstrap rebuilt for React. Include Bootstrap components right in your JavaScript
Semi Design	A modern, comprehensive, flexible design system that gives you all modular blocks you need to build sensible web apps & SaaS products.
Mantine	React components and hooks library with native dark theme support focused on usability, accessibility and developer experience.
NextUI	Beautiful, fast and modern React UI library that allows you to create beatiful websites regardless of your design experience.
Arco Design	A comprehensive React UI components library based on the Arco Design system.
ui-playbook	The documented collection of UI components
ReactStrap	Another Bootstrap UI library for React
React Admin	A frontend Framework for building admin applications. Supports API's out of the box
BlueprintJS	React-based UI toolkit for the web
React Semantic UI	UI components based off of the Semantic UI framework
Shards React	React UI kit featuring a modern design system with dozens of custom components
React Virtualized	UI set for data. Includes tables, lists, sorting, etc.
React Toolbox	Material design UI library for React
Elastic UI	Distributes UI React components and static assets for use in building web layouts
React Desktop	Desktop styled components in React. Includes MacOS and Windows based components
Theme UI	Build consistent, themeable React apps based on constraint-based design principles
Onsen React	Distributes Components for hybrid mobile apps with React and Onsen UI
Evergreen	Design system for React
Rebass	React primitive UI components built with styled system
Grommet	mobile first UI component library
Landing Page Template	Open source landing page template for react
Elemental UI	A UI Toolkit for React.js Websites and Apps
Ant Design	Open source design React UI library.
Bumbag	Bumbag is a friendly React UI Kit suitable for MVPs or large-scale applications.
PRIMEREACT	The ultimate collection of design-agnostic, flexible and accessible React UI Components
Primer Components	Primer Components are React components which implement GitHub's Primer Design System
Orbit	Design system and React UI components for travel projects.
Base Web	Base Web provides a robust suite of components out of the box
Backpack UI	Backpack is the Lonely Planet toolset that we use to build front end apps.
Reaviz	Data visualization library for React based on D3
React Suite	A suite of React components, sensible UI design, and a friendly development experience.
React Spring	Spring-physics based animation library for React applications.
Recharts	A composable charting library built on React components.
Vercel UI	Modern and minimalist React UI library
Framer Motion	A React library to power production-ready animations.
React Spectrum	A React implementation of Spectrum, Adobe’s design system.
@tsparticles/react	A lightweight React component for creating particles
particles-bg	A React particles animation background component
Treact	Gallery of free and modern React templates and UI components developed using TailwindCSS as the front-end framework
OAH-Admin	a free React admin dashboard template based on Gatsby with oah-ui components and elements package.
Carolina Admin Dashboard	Free React admin template is powered by Material-UI components framework and features a clean and fresh design following Google's Material Design specifications.
Tabler	Tabler is a free React admin dashboard template ideal for any kind of back-end web application.
Sha-el-design	React components for easier customization and smooth development flow.
React-WeUI	React-WeUI made from our love of React and WeChat's WeUI Design.
Supabase UI	An open-source UI component library inspired by Tailwind and AntDesign.
Ring UI	A collection of JetBrains Web UI components.
React95	Refreshed Windows 95 style UI components for your React app.
Reakit	Reakit is a lower level component library for building accessible high level UI libraries, design systems and applications with React.
Zent	A collection of essential UI components written with React.
Gestalt	A set of React UI components that supports Pinterest’s design language.
xstyled	A CSS-in-JS framework built for React with props based utilities like display, fontSize or rotate.
@use-gesture	Bread n butter utility for component-tied mouse/touch gestures in React.
React Rainbow	React Rainbow is a collection of components that will reliably help you build your application in a snap.
React Use Smooth Scroll	React Provider Component to add a smooth scroll effect
Choc UI	Choc UI is a set of accessible and reusable components that are commonly used in web applications.
Elementz	A React Component library for buliding modern applications easily & quickly.
Radix UI	Unstyled, accessible components for building high‑quality design systems and web apps in React
Materio MUI React NextJS Admin Template	Most Powerful & Comprehensive Open-source MUI React NextJS Admin Dashboard Template built for developers.
Chakra Templates	A growing collection of hand-crafted & responsive Chakra UI templates ready to drop into your React project.
React Resizable Panels	React components for resizable panel groups/layouts.
Carbon React	Extensive library of React components for Websites and UI's. Based on the Carbon Design System from IBM
React Aria	A library of React Hooks that provides accessible UI primitives for your design system.
shadcn/ui	Beautifully designed components built with Radix UI and Tailwind CSS.
Tremor	React components to build charts and dashboards with

↥ Back To Top

Vue UI Libraries

UI and component libraries for the Vue JavaScript framework

Website	Description
Vuetify	Material design component framework
Bootstrap Vue	Use Bootstrap components with Vue
Buefy	Lightweight UI components based on Bulma
Semantic UI Vue	Semantic UI Vue is the Vue integration for Semantic UI
Arco Design Vue	A comprehensive Vue UI components library based on the Arco Design system.
VEUI	VEUI is an enterprise UI component library, based on Vue.js.
Grace	Design System For Vue Applications.
Quasar	High-performance Material Design component suite with builders for SPA, SSR, PWA, Mobile (Cordova & Capacitor), Desktop (Electron) and Browser extensions
Element	Desktop UI library for Vue
Fish UI	Vue UI toolkit for the web
Keen UI	VueUI library with a simple API, inspired by Google's Material Design
Materio Vuetify Vuejs Admin Template	Open-source & Easy to use Vuetify Vuejs Admin Template with Elegant Design & Unique Layout
Onsen Vue	Distributes Components for hybrid mobile apps with Vue and Onsen UI
Vuejsexamples	A nice collection of useful vuejs UI components
Inkline	Inkline is a modern UI/UX Framework for Vue.js designed for creating flawless responsive web applications
Vuesax	Unique and reusable UI components
Antdv	UI library for Vue based on Ant Design
Shards Vue	A high-quality & free Vue UI kit featuring a modern design system with dozens of custom components
Prime Vue	Powerful yet simple to use, versatile, performant Vue UI Component Library to help you build stunning user interfaces.
Chakra UI Vue	Chakra UI is a simple modular and accessible component library that gives you the building blocks to build Vue applications with speed.
View UI	Dozens of useful and beautiful Vue components made for people with all skill levels with extensive documentation.
@tsparticles/vue2	A lightweight Vue 2.x component for creating particles
@tsparticles/vue3	A lightweight Vue 3.x component for creating particles
TC Components	A library of high-quality ready to use components that will help you speed up your development workflow.
Vant	Lightweight Mobile UI Components built on Vue.
Equal UI	Open-source Vue 3 components system for your next project based on TypeScript
Mint UI	Mobile UI elements for Vue.js
Cube UI	A fantastic mobile ui lib implement by Vue.js
Muse UI	Based on the Vue 2.0 elegant Material Design UI component library
AT-UI	AT-UI is a modular front-end UI framework for developing fast and powerful web interfaces based on Vue.js.
Vuikit	A consistent and responsive Vue UI library, based on the front-end framework UIkit.
Wave UI	A Vue.js UI framework with only the bright side.
VueTailwind	Set of Lightview and fully customizable Vue Components optimized for TailwindCSS.
Oruga	Oruga is a lightweight library of UI components for Vue.js without CSS framework dependency.
BalmUI	BalmUI is a modular and customizable Material Design UI library for Vue.js.
Weex UI	A rich interaction, lightweight, high performance UI library based on Weex.
Varlet	Varlet is a Material design mobile component library developed based on Vue3, developed and maintained by partners in the community.
Naive UI	A Vue 3 Component Library. Fairly Complete. Customizable Themes. Uses TypeScript. Not too Slow.
Vuestic	Free and Open Source UI Library for Vue 3 🤘.
Vue Final Modal	Vue Final Modal is a tiny, renderless, mobile-friendly, feature-rich modal component for Vue.js.
Vuetensils	Vuetensils is a lightweight component library for Vue 2.x that brings some of most common UI features, but only the bare minimum styles to avoid adding any extra bloat. You can work on the branding, and don't have to worry about the accessibility.
NuxtLabs UI	Fully styled and customizable components for Nuxt.

↥ Back To Top

Angular UI Libraries

UI and component libraries for the Angular JavaScript framework

Website	Description
Material Angular	UI library for Angular based on Material design
NG Bootstrap	UI library for Angular based on the Bootstrap framework
PrimeNG	Powerful UI component library for Angular
Onsen Angular	Hybrid mobile and PWA UI library for Angular and Onsen UI
NG Lightning	Native Angular components & directives for Lightning Design System
NG Semantic	UI library for Angular based on Semantic UI
Nebular	Customizable UI Kit, Auth & Security for Angular
Alyle UI	Minimal components set for Angular
NGX Bootstrap	Another UI library for Angular based on the Bootstrap framework
NG Zorro	UI library for Angular based on Ant Design
Pagination for datatables	npm library for pagination
Multi select dropdown	For multi select drop-dowm in forms
NG Particles	A lightweight Angular component for creating particles
Covalent UI	Angular UI Platform focused on solving common enterprise needs
Clarity	CSS based Angular UI framework developed by VMware group
Taiga UI	Taiga UI is fully-treeshakable Angular UI Kit consisting of multiple base libraries and several add-ons.
ngx-admin	Admin template based on Angular 10+ and Nebular

↥ Back To Top

Svelte UI Libraries

UI and component libraries for the Svelte JavaScript compiler

Website	Description
Svelte Material UI	UI library for Svelte based on Material Design
SvelteStrap	UI library for Svelte based on the Bootstrap framework
Svelte Flat UI	UI library for Svelte based on Flat Design
@tsparticles/svelte	A lightweight Svelte component for creating particles
Attractions	A pretty cool UI kit for Svelte
Svelteit	A minimalistic UI/UX component library for Svelte and Sapper projects
Carbon Components Svelte	A component library that implements the Carbon Design System, an open source design system by IBM.
Radix Svelte	This is a port of Radix UI for Svelte.
shadcn-svelte	shadcn-svelte is an unofficial community-led Svelte port of shadcn/ui.
Skeleton	Skeleton is an open source UI toolkit built with Svelte + Tailwind that allows you to create reactive web interfaces using Svelte + Tailwind CSS.

↥ Back To Top

React Native UI Libraries

UI and component libraries for the React Native Framework

Website	Description
Magnus UI	Magnus UI is the ultimate UI framework that helps you in building consistent user interfaces effortlessly in react native
React Native UI Lib	React Native UI (RNUI) is a UI Toolset & Components Library for React Native from Wix
React Native Paper	React Native Paper is a high-quality, standard-compliant Material Design library that has you covered in all major use-cases
UI Kitten	UI Kitten is React Native framework for creating stunning cross-platform mobile applications. Design system based, brings your product from MVP to enterprise.
React Native Elements	Cross Platform React Native UI Toolkit that provides an all-in-one UI kit for creating apps in react native.
NativeBase	Essential cross-platform UI components for React Native & Vue Native.
Shoutem UI	Shoutem UI toolkit enables you to build professionally looking React Native apps with ease.
tailwind-rn	Use Tailwind CSS in React Native projects.
Ant Design Mobile RN	An Ant design based configurable Mobile UI component library based on React Native.
SnackUI	SnackUI is a UI Kit for React Native + react-native-web that's much faster rocket with an optimizing compiler.
Moti	Moti is the universal animation package for React Native
Tamagui	Universal React design systems that optimize for native & web.

↥ Back To Top

Design Systems & Style Guides

Design systems, style guides, toolkits, docs. Some of these are design guides for top companies/websites

Website	Description
Material Design	Google's Material Design
Ant Design	Design system for enterprise-level products
Apple Design Resources	Guides and templates for using Apple design and UI
Primer	Design, build, and create with GitHub’s design system
Arco.design	An enterprise-level design system jointly launched by the Bytedance GIP UED team and the architecture front-end team.
Alta UI	Oracle's design system and toolkit
Pulse	Design system, guides and React component library
Bolt	Robust Twig and web component powered UI components
Clarity Design System	UX guidelines, HTML/CSS framework, and Angular components
AtlasKit	Atlassian's official UI library, built according to the Atlassian Design Guidelines
Audi Design Resources	Audi UI design system and toolkit
Carbon Design Systems	Carbon is IBM’s open-source design system for products and experiences
Yelp Style Guide	Yelp style guide, components and toolkit
Comet	Scalable design system of visual language, components, and design assets
ETrade Design System	Guides and toolkits that blend finance with simplicity and ease of use
Fundamental Library	Open source and community driven project for consistent user interfaces
Infor Design	Guidelines and resources to create meaningful experiences for Infor’s products
Lexicon	An experience language for crafting beautiful UI
Mailchimp UI/UX	Style guide and components from Mailchimp
Marvel Style Guide	Set of design principles and components
Microsoft Fluent UI	Collection of UX frameworks from Microsoft
Pluralsight Design System	Design guide with components for designing with Pluralsight
Polaris	Design system that creates great experiences for all of Shopify’s merchants
Mozilla Protocol	Protocol is a design system for Mozilla and Firefox websites
SendGrid Style Guide	UI library for developing consistent UI/UX at SendGrid
VTEX Styleguide	Reusable patterns, components and assets related to product design in VTEX
Rizzo	Style guide with UI components, JS components, widgets, etc
Atomize	UI framework that helps developers collaborate with designers and build consistent user interfaces effortlessly
StyleGuides.io	A directory of 500+ styleguides
Done Design System	Open source design system, guides & components
Skoda Brand System	Design guideline for developing applications under the Skoda brand
Spectrum	Adobe’s design system that provides components and tools to help product teams work more efficiently, and to make Adobe’s applications more cohesive.
Asphalt	Gojek’s design language system. A collection of guidelines and components to create amazing user experiences.
Laws of UX	A collection of the key maxims that designers must consider when building user interfaces.
Checklist Design	Checklist Design is a curated list of checklists ranging from website pages, to UI components, all the way to branding assets.
Humane By Design	A resource that provides guidance for designing ethically humane digital products through patterns focused on user well-being.
Pr1mer Guidelines	An open source set of very general guidelines, inspired by Human Interface. Created and maintained by Pr1mer Tech
Patterfly	PatternFly is an open source design system from Red Hat, Inc.
Patterns	A resource to improve on design patterns and component patterns for building powerful web apps with vanilla JavaScript and React.
Design Principles For Developers	A resource to improve Design principles and guidelines for developers.

↥ Back To Top

Online Design Tools

All kinds of online tools for design, from photo editors to wireframing, and more

Website	Description
Figma	Online graphic design tool (Free & paid options)
Penpot	Penpot is the first Open Source design and prototyping platform meant for cross-domain teams. Non dependent on operating systems, Penpot is web based and works with open web standards (SVG). For all and empowered by the community Open Source and selfhostable
Vectr	Free vector graphics software
Taler	Create social media banner designs in minutes from hundreds of customizable templates
Canva	Create beautiful designs (Free & Paid)
Get Waves	A free SVG wave generator to make unique SVG waves for web design
Clippy	Easy CSS clip-path maker
Fancy Border Radius	Eight values specifying border-radius in CSS ( border-radius generator )
Wireframe.cc	Wireframing tool (free & paid)
Fotor	Photo editor and design maker
Pixlr	Online photo editor
Animoto Video Maker	Make videos online
RemoveBG	Remove image backgrounds
Photo Creator	Create your own photos instead of searching for stock
Visme	Create presentations, infographics and more
Infogram	Create infograms
ChartGo	Create charts and graphs online
Cartoon Photo	Turn photos into cartoons
Whimsical	Wireframes, diagrams and more (4 free)
Whiteboard	Online drawing tool
Octopus	Sitemap builder
Onlineboard	Real-time shareable whiteboard for brainstorming
CTA Button Maker	Create call to action buttons
Blobmaker	Blobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes.
Personas	A playful avatar generator for the modern age
Photopea	An Online Photoshop editor
Excalidraw	Virtual whiteboard for sketching hand-drawn like diagrams
Diagrams	Diagram software and Flowchart maker
Mermaid	renders Markdown-inspired text definitions to create and modify diagrams (like flowchart, sequence diagram, gantt, or user journey) dynamically. (FOSS)
MapInSeconds	Simple way to visualize your data with a map
Grid Malven	A css grid cheatsheet to reference when creating a css grid
Flex Malven	A flexbox grid cheatsheet to reference when working with flexbox
Smart Upscaler	Upscale images by 2-4x resolution (4 free)
GetAvataaars	Fun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch library
Big Heads	Easily generate avatars for your projects with Big Heads by Robert Broersma.
Webflow	Break the code barrier, Build better business websites, faster. Without coding.
Trace	Instantly remove the background from your photos
Neumorphism.io	Generate Soft-UI CSS shadow code
DB Designer	Design your database for free online
Ui Bakery	Create full-fledged web apps visually
Faux	Turn real code into faux code
Rive	Real-time interactive design tool that allows you to design, animate, and immediately integrate your assets into any platform.
Unscreen	Remove Video Background 100% Automatically and Free
Kodeshot	Convert your source code into nice pictures for your articles, tweets, messages, posts...
Wix	Create a Website You’re Proud Of
GTmetrix	Website Speed and Performance Optimization
Yellow Lab Tools	Online test to help speeding up heavy web pages
Framer	Is prototyping tool for teams
Draw.io	Free online diagram editor tool
UXWing SVG Editor	Creating and Edit SVG Online
CSS Arrow	Create and export CSS code for a custom box with an arrow extending out from the side. Great for tooltips, flyouts and the like.
Lucidchart	Diagramming and visualization tools that allows creating databases, flowcharts, boards, floor-maps, and much more. 3 multi-page documents on the free tier
Carbon	Create and share beautiful images of your source code by typing or drop a file.
PixCleaner	Accurate and hassle free background removal tool
Glass UI	A modern CSS UI library based on the glassmorphism design principles that will help you quickly design and build beautiful websites and applications.
Glassmorphism	An incredible online tool for generating quick glassmorphic UI in CSS code snippets.
TableConvert	Table Convert Online is a web-based tool to converts Excel, URL, HTML, Markdown table and CSV to Markdown table, CSV/TSV, JSON, XML, YAML, insert SQL, HTML, Excel and LaTeX table.
Doodle Ipsum	The lorem ipsum of illustrations. Just customize your doodles, grab the code, and use them on your web prototypes, landing pages, or no-code tools.
Figen	Post Cover & Background Generator Tool
Windframe	A tool to rapidly prototype and build stunning websites using Tailwind CSS (Free & Premium)
Slickr	A tool for designing cover image for your blog.
Shadow Palette Generator	Create a set of lush, realistic CSS shadows.
Ray.so	Online tool to create beautiful images of your code.
Codepng	Convert your source code into awesome shareable images.
CSS Grid Generator	A tool for creating CSS Grid Layouts
JSONT	A simple and powerful online JSON formatting tool
Jitter	Online tool to create motion graphics/design
Visily	Tool that empowers non-designers to design web and mobile app mockups
okso.app	The drawing app with a nested "drawing-inside-the-drawing" structure
Calc Generator	Tool for easily creating precise Calc() CSS functions
Scrollbar.app	Simple online editor for creating custom CSS scrollbars
GrapesJS	Open-source, multi-purpose, Web Builder Framework which combines different tools and features with the goal to help you (or users of your application) to build HTML templates without any knowledge of coding.

↥ Back To Top

Downloadable Design Software

Free software for UI, photo, 3d modeling, etc. Alternatives to paid software like Photoshop

Website	Description
Gimp	Free & open source image editor similar to Photoshop
Gravit Designer	Free full-featured vector graphic design app that works on ALL platforms
Blender	Open source, free animation, 3D modeling, etc.
Raw Therapee	Cross-platform raw image processing program
Be Funky	Online design program
Krita	Sketching and painting program designed for digital artists
Pencil Project	GUI prototyping software
Inkscape	Powerful free design tool
Adobe XD	Free design tool from Adobe
Shapes.so	Icons that can be used as code in your projects
Lunacy	Sketch for Windows
InVision Studio	Free screen designing tool from InVision
Darktable	Free & Open source photography workflow application and raw developer
Inpixio photo Editor	Free Photo Editor: For windows only
Colorpicker	Open Source colors software: Retrieve, manipulate and store your colors easily!
Google Web Designer	Create engaging, interactive HTML5-based designs and motion graphics that can run on any device.
Origami Studio	Interactive interface design tool created by Facebook: For mac only

↥ Back To Top

Design Inspiration

Here are some websites to get inspiration for design and UI

Website	Description
CSS Zen Garden	Demonstrating the power of CSS, over 200 CSS-only interpretations of the same HTML file.
Behance	Design projects featured by different creators
Dribbble	Design projects featured by different creators
Landingfolio	Landingfolio features the best landing page inspiration, templates, resources and examples on the web.
Codewell	Practice your HTML, CSS, and Javascript skills on real world design templates
Foxyapps	Design inspiration from the best mobile app designs
Httpster	Showcases websites made by people from all over the world
Inspofinds	Latest design work from designers and the design community
Design Notes	Free online resource library for product designers
Land Book	Displays a large collection of websites to help find inspiration
Frontend Mentor	Real-world UI Challenges using HTML, CSS and Javascript
Awwwards	A website that rate and collects the best websites in the world in UI
Codrops	A website that collects the best UI ideas and patterns and make tutorials of it
SaaS Landing Page	Discover the best landing page examples created by top-class SaaS companies
Saaspages.xyz	A collection of the best landing pages with a focus on copywriting and design.
Screenlane	Screenlane is a website and newsletter that features the latest web and mobile design inspiration.
lapa ninja	Best landing page inspiration
Freefrontend	Free frontend design from css html and javascript. latest work some design part
Webframe	Discover and be inspired by beautiful webapp designs
Collect UI	Daily inspiration collected from daily ui archive and beyond. Handpicked, and updating daily.
Graphic Burger	A site offering a free and pain icons, mock-ups, Ui-Kits, text effect and backgrounds. This site's resource are a mix of free and paid resources. Icons is on a mix of PNG, SVG, EPS and Sketch Format. Some resources are confusing as there are sponsored content in the middle of the free sets.
Really Good Emails	A site offering users a ton of company e-mails from customer service to marketing.
Free Design Resource	A site offering fonts, mockups, templates graphics and ui kits.
Site Inspire	siteInspire is a showcase of the finest web and interactive design.
Web Design Inspiration	A site for web design inspiration, updated daily.
NavNav	Responsive navigation examples
Calltoidea	Collection of different web Components for inspiration.
MediaQueri.es	A collection of inspirational websites using media queries and responsive web design
Mulzli Search	Search engine for design inspiration
DeviantArt	Access to 370 million pieces of art for inspiration.
Design your way	Collection of different Web and Mobile Designs
Humans.fyi	A collection of brilliant personal websites filterable by colors and web technologies used in each website.
SiteSee	A curated gallery of beautiful and modern websites.
UI Garage	Daily handpicked UI inspiration & patterns.
ecomm.design	eCommerce Website Design Gallery & Tech Inspiration.
Design Nominees	A showcase of awarding and showcasing the best websites, apps and Games.
Design Vault	A library of screenshots and patterns from real world digital products
CSS buttons	84 Beautiful CSS buttons examples.
CSS box-shadow	91 Beautiful CSS box-shadow examples.
Super Designer	Design tools that give you super powers.
Landings	Find the best landing pages for your design inspiration based on your preference.
Page Collective	Page Collective is part of a network of design inspiration websites.
Curated	Unleash your creativity with out-of-this-world web design inspiration from across the web.
Maxibestofone	Daily feed of websites & fonts inspiration.
Bento Grids	Bento Grids is a curated collection of tiles-based layouts that were popularized by Apple with their summary slides.
Landing Gallery	Home of the best landing page design inspiration.
a-fresh.website	Hand—picked website and component inspiration library.

↥ Back To Top

Image Compression

Websites that allow you to compress large images

Website	Description
TinyPNG	Smart PNG and JPEG compression
Optimizilla	Online JPEG and PNG optimizer / compressor with settings and archive download
Compressor.io	JPEG, PNG, GIF, SVG Compression
Squoosh.app	Image compression from Google Chrome Labs
BulkResizePhotos	Bulk image resizing, compression & converting that perform all the tasks within the browser (It works offline)
iLoveIMG	The fastest free web app for easy image modification
SvgOMG	Online SVG optimizer with a lot of settings and possibility to cut and paste svg code directly in it.
CompressJPEG	Compress JPEG images with size even greater than 5MB
CompressNow	JPEG, GIF, PNG Compression
Promo Image Resizer	Free Image and Photo Resizer
Image Optimizer	Image Optimizer Free With Quality Options
SVGminify	This tool removes superfluous information, thereby reducing the size of your SVG files
JPEG Optimizer	Free online tool for resizing and compressing digital photos and images for displaying on the web
Resizing.app	Resize Your Images Online
EZGif	Animated GIF maker and Image editor including Image optimization and supports WebP conversion
OnlinePngtools	Resize png for without losing transparent background.
Verexif	Remove meta tags in image in order to reduce image size and increase privacy security
Vecta Nano	Uses lossless compression to compress inefficient SVG codes by removing unnecessary data. (Free & Paid)
Watermarkly	Private, client-side compression of JPEG images. The app does not send images to a server for processing.
Jpeg.io	Convert any major image format into a highly optimized JPEG
CompressImage.io	Compress JPG and PNG images. No Limits. Bulk Conversion. Convert to WebP. Works Offline

↥ Back To Top

Chrome Extensions

Useful Chrome extensions for Designers and Web-Developers.

Website	Description
WhatFont	The easiest way to identify fonts on web pages.
WhatRuns	Discover what runs a website. Frameworks, Analytics Tools, Wordpress Plugins, Fonts - you name it.
Web Developer	Adds a toolbar button with various web developer tools.
Awesome Screenshot & Screen Recorder	Full page screen capture and screen recorder - 2 in 1. Share screencast video instantly
daily.dev - News for Busy Developers	Get programming news with zero effort. Simply open a new tab, and you’re all set. A must-have tool for busy developers!
JSONView	Validate and view JSON documents.
JSON Lite	Browser extension for viewing JSON files.
Window Resizer	Resize the browser window to emulate various screen resolutions.
Responsive Viewer	Show multiple screens once, Responsive design tester
BrowserStack	Instantly test your webpage on any desktop or mobile browser.
VisBug	Open source web design debug tool built with JavaScript
Kontrast - WCAG Contrast Checker	Quickly check and adjust contrast in real-time in your browser to meet WCAG 2.1 requirements
PerfectPixel	Adds a semi-transparent image overlay over the top of the developed HTML to easily perform pixel perfect comparison between them, useful for replicating UI designs.
Pesticide	Inserts the Pesticide CSS into the current page, outlining each HTML element to better see placement on the page, helpful for building layouts.
Site Palette	A must-have tool for designers and frontend developers to grab colors for any website.
ColorZilla	Advanced Eyedropper, Color Picker, Gradient Generator and other colorful goodies
Lorem Ipsum Generator (Default Text)	Provides an elegant and quick way to create default text or generate Lorem Ipsum. Optimized for quick usage, but it can be customized.
JavaScript and CSS Code Beautifier	Beautify CSS, JavaScript and JSON code when you open a .css/.js/.json file
Imageye - Image downloader	Find and download all images on a web page. With Imageye you can find, browse and download all the images present in a web page.
GoFullPage - Full Page Screen Capture	Capture a screenshot of your current page in entirety and reliably—without requesting any extra permissions!
Stylebot	Change the appearance of the web instantly.
ColorPick Eyedropper	A zoomed eyedropper & color chooser tool that allows you to select color values from webpages and more.
React Developer Tool	React debugging tools to the Chrome Developer Tools. It allows you to inspect the React component hierarchies in the Chrome Developer Tools.
Wappalyzer	Wappalyzer is a technology profiler that shows you what websites are built with.
Fake Filler	Fake Filler a form filler that fills all inputs on a page with fake/dummy data.
Page Ruler Redux	A Web Developer\Designer ruler to get perfect pixel dimensions and positioning to measure elements on any web page.
Web Editor	The web editor is the tool that provides you with an enhanced way to inspect any website elements, alter their properties, insert contents, design, and visualize the way you want to see them.
CSSViewer	A simple CSS property viewer.
Fonts Ninja	Identify fonts from any website, bookmark, try, and buy them.
Lighthouse	An open-source, automated tool for improving the performance, quality, and correctness of your web apps.
Debug CSS	Adds outline to all elements on the page to show the culprit element which is changing desired layout. Helps in debugging CSS of the page
UX Check	Identify usability issues through a heuristic evaluation.
Angular Developer Tool	Angular DevTools allows you to understand the structure of your application and preview the state of the directive and the component instances.
Redux Developer Tool	Redux DevTools provides power-ups for your Redux development workflow. Apart from Redux, it can be used with any other architectures which handle the state.
Hackertab.dev	Hackertab helps developers stay up-to-date with the latest dev news and resources in one tab.
JSON Formatter	Formats and colors JSON content for better readability. It can also collapse and expand nested structures.
SEO Minion	A SEO tool that includes features like on-page SEO analysis, broken link checking, and SERP preview and more.

↥ Back To Top

Firefox Extensions

Useful Firefox extensions for Designers and Web-Developers.

Extension	Description
WhatFont	Identify fonts on web pages
WhatRuns	Discover technologies used on websites
Web Developer	Toolbar for web development tasks
Awesome Screenshot & Screen Recorder	Capture and annotate screenshots
daily.dev - News for Busy Developers	Developer news and resources
JSONView	Format and syntax highlight JSON
Window Resizer	Resize browser window to predefined dimensions
Responsive Viewer	Test responsive design of websites
BrowserStack	Instantly preview websites on different devices
VisBug	Web design debugging tool
Kontrast - WCAG Contrast Checker	Check contrast levels for accessibility
PerfectPixel	Overlay an image over a web page to compare
Pesticide	Outline elements on web page for easy visualization
Site Palette	Extract color palette from website
ColorZilla	Advanced color picker and eyedropper
Lorem Ipsum Generator (Default Text)	Generate lorem ipsum text
JavaScript and CSS Code Beautifier	Beautify and minify JavaScript and CSS code
Imageye - Image downloader	Download images from web pages
Fireshot - Full Page Screen Capture	Capture full web pages
Stylebot	Customize the appearance of web pages
ColorPick Eyedropper	Simple color picker and eyedropper
React Developer Tool	Inspect React component hierarchy
Wappalyzer	Identify technologies used on websites
Fake Filler	Fill out web forms with dummy data

↥ Back To Top

AI Graphic Design Tools

AI tools that offer free service to generate design

Website	Description
Leonardo.Ai	Leonardo AI is an AI-powered design tool that can help you create designs based on reference images.
Galileo AI	Galileo AI is a UI generation platform for easy and fast design ideation. It allows users to generate interface designs from text.
ImgGen.Ai	ImgGen AI is a free AI-powered image generator and enhancement tool.

↥ Back To Top

Others

Uncategorized Stuff

Website	Description
Figpeek	Figpeek is a new Figma and GitHub thumbnail generator.
Image Extractor	Online tool for extracting all images and SVGs of a website, all you is just to drop the URL
Vertopal	Free online platform for converting computer files to a variety of file formats
everysize.kibalabs.com	Check your awesome responsive webpage looks great in every size
Devhints.io	This is a modest collection of cheatsheets on Internet
The Web Toolbox	A collection of handy, free-to-use tools for web developers, programmers and designers.
WebDevTrick	A famous blog for many amazing HTML, CSS, JQuery designs.
css-tricks	Free CSS tricks and some unique ideas for beginners and advanced
Material Design Resources	Use Material tools, downloads, and interactive projects to simplify your workflow.
Nodesign.dev	A collection of tools for developers who have little to no artistic talent
A11ygator	A web tool to scan websites against WCAG rules
Commitizen	Command line tool to formatted commit messages according to the standards
CleanCss	Tool For Code Formatter, Minifier, File Converter
Tiny helpers	A collection of free single-purpose online tools for web developers
CSS Ribbon Generator	This generator will assist in creating a pure CSS corner ribbon.
Can I Use	Check cross-browser compatibility of frontend technologies.
kangax-js-compat-table	Check JavaScript versions (ES5, ES6, ES2016+ etc.) compatibility across different compilers, servers/runtimes and platforms (Desktop and Mobile).
mydevice.io	Most commonly used device resolutions including phones and tablets
Codepen	Build, test and discover frontend code.
Responsively	A tool for designers and frontend developers to design and debug their in all platforms with ease
html2pdf.js	Client-side HTML-to-PDF rendering using pure JS.
CSS Reference	A collection of all css properties and definitions in detail
Critical Path CSS Generator	Generate critical css for your web pages
SVG Gobbler	Browser extension to find SVGs on a webpage and download, copy to clipboard, or export as PNG.
shortcode.dev	A collection of useful snippets and code examples for HTML, CSS, JavaScript, Node, Artisan, Blade and more.
30secondsofcode.org	A wide variety of snippet and article collections for CSS, JavaScript, Python and more.
PlayCode	Javascript playground.
All The Tags	All HTML tags briefly explained.
Vue Telemetry	Reveal the Vue plugins and technology stack powering any website or explore a database of 5500+ websites.
Grid.js	Grid.js is a Free and open-source HTML table plugin written in TypeScript. It works with most JavaScript frameworks, including React, Angular, Vue and VanillaJs.
Gerillass	Gerillass is a website development tool built on top of Sass with a set of Sass mixins and functions for frontend developers to generate scalable CSS outputs.
Sketchize	Sketchize is built for UI/UX Designers to help them design lovely apps for mobile, tablet, and desktop devices.
{CSS}Portal	CSSPortal is home to a large range of CSS generators, tools and resources.
DevDocs	DevDocs combines multiple API documentations in a fast, organized, and searchable interface.
papersizes	The best resource for International Paper Sizes, Dimensions & Formats.
flexboxfroggy	Help Froggy and friends by writing CSS code!
Designbetter Books	Essential reading on the practices that propel the best design teams forward.
OverAPI	Collection Of All Cheat Sheets.
Pageclip	A server for your Static HTML forms
Shields	Create badges with your own customization.
williamsharkey	Random SVG Graphic Generator
Bootstrap CheatSheet	An interactive list of Bootstrap classes, variables, and mixins. The only Bootstrap CheatSheet you will ever need.
QR Code Generator	Use QR Code Generator to easily create a QR code for your project.
PapersDB	The Biggest Paper Database with Sizes, Dimensions and Formats in Metric and Imperial units.
SETools.xyz	Free Online tools website for work
SmallDev.tools	Free tool for developers to help with Beautify & Minify HTML/CSS/Javascript, and many other handy tools. With a delightful interface.
Angry Tools	Free web tools for speed up your development.
Rapid API	Discover and connect to thousands of APIs.
Readme.so	The easisest way to create a README.
Showcode	Beautiful code screenshot generator.
tldraw	A tiny little drawing app.
devices.css	Pure CSS phones and tablets by Marvel App.
Troopl	Build and publish a free portfolio in minutes.
Apifox	Apifox = Postman + Swagger + Mock + JMeter
A Modern CSS Reset	Resets the css styling of all HTML elements to a consistent baseline across browsers.
Clipperly	All-in-one free online file service, convert, edit and optimize your files.
DebugBear Speed Test	Test and optimize page load speed
Code Beautify	Free Online Tools like Code Beautifiers, Code Formatters, Editors, Viewers, Minifier, Validators, Converters for Developers
Vue CheatSheet	An interactive cheatsheet of Vue, Vue Router, and Pinia. The only Vue CheatSheet you will ever need.
appydev	A collection of awesome tools, resources and products for people who create and live on the internet.

↥ Back To Top

License

Root-FTW/design-resources-for-developers

ErrorLooks like something went wrong!

About

Resources

License

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Error
Looks like something went wrong!

Packages