Skip to content
This repository has been archived by the owner on Sep 5, 2022. It is now read-only.

Curated list of design and UI resources from stock photos, web templates, CSS frameworks, UI libraries, tools and much more.

License

Notifications You must be signed in to change notification settings

ravindramevada/design-resources-for-developers

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 

Repository files navigation

Design Resources for Developers

Banner

UI Graphics

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
thepatternlibrary Free beautiful background patterns
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 Free 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 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
Boring Avatars SVG random, cutely avatars collections

Fonts

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
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

Colors

Website Description
Color Brewer 2 The original color palette generator, also supporting color blindness
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
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

Icons

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 470+ highly customizable open source SVG icons
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

Logos

Website Description
Instant Logo Search Thousands of free brands logos ( SVG - PNG )
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
Namecheap Logo Maker Create and download custom Logos for free

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

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

Stock Photos

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

Stock Videos

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

Stock Music & 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

Vectors & Clip Art

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

Product & Image Mockups

Website Description
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

HTML & CSS Templates

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
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

CSS Frameworks

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
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

CSS Methodologies

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

CSS Animations

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

Javascript Animation Libraries

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!

Javascript Chart Libraries

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

UI Components & 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

Design Systems & Style Guides

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.

Online Design Tools

Website Description
Figma Online graphic design tool (Free & paid options)
Penpot Open Source and selfhostable online graphic design tool
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
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
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
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
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
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

Downloadable Design Software

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

Design Inspiration

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
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

Image Compression

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
Jpeg.io Convert any major image format into a highly optimized JPEG

Chrome Extensions

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
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
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
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

Others

Website Description
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
Grid.js Grid.js is a Free and open-source HTML table plugin written in TypeScript
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
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

Note: This repository is owned by @bradtraversy.

About

Curated list of design and UI resources from stock photos, web templates, CSS frameworks, UI libraries, tools and much more.

Topics

Resources

License

Stars

Watchers

Forks