加入CODE CHINA

· 不限速    · 不限空间    · 不限人数    · 私仓免费

免费加入
    readme.md

    Repository Banner

    Please read contributing guidelines before submitting new resources.

    Table of Contents

    UI Graphics

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

    Website                            Description
    UI Design Daily 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
    FreebieSketch Free Sketch designs, wireframes, illustrations, and more.
    Blush Free customizable illustrations with Figma Plugin
    Hero Patterns A collection of repeatable SVG background patterns
    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.
    Storytale.io Subset of Storytale free quality illustrations
    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 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

    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
    FontSpark Discover Better Fonts
    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

    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.
    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.
    Paletter Create a color palette from a single color
    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
    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.

    Icons

    Resources for Icons including png, svg and more

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

    Logos

    Resources for 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
    LogoHub Generate and download your logo for free in PNG and SVG format
    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

    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

    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

    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.

    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

    Stock Music & Sound Effects

    Websites that offer free stock music and/or sound effects

    Website                            Description
    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
    Unminus Free Premium Music for Your Projects 🎁 Royalty Free. Cleared for YouTube.

    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
    Retro Vectors Vintage vectors and 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 .
    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.

    Product & Image Mockups

    Create mockups of devices and other products

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

    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
    Templated.co Tons of minimalistic HTML5/CSS3 themes
    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

    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
    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.
    Shorthand Shorthand is a free and open source css framework, that allows you to make unique and modern design without writing any css
    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 gorgeous CSS Framework for the web
    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.

    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.

    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.

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

    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 use.
    Data Driven Documents (D3) bind complicated and massive data to interactive graphs.

    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
    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
    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 .
    Tailwindow Components created using Tailwind CSS utilities class, so it can be customized to make themes easily.
    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.

    React UI

    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
    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
    Rimble React design kit, library and guides
    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.
    React tsParticles 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.
    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.

    Vue UI

    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
    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
    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.
    Particles.vue A lightweight Vue 2.x component for creating particles
    Particles.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.

    Angular UI

    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
    NGX Foundation UI framework based on the veteran CSS framework foundation
    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.

    Svelte UI

    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
    Svelte Particles A lightweight Svelte component for creating particles

    React Native UI

    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

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

    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)
    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
    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
    SoftUI A Soft UI (neumorphism) CSS generator
    Photopea An Online Photoshop editor
    Excalidraw Virtual whiteboard for sketching hand-drawn like diagrams
    Diagrams Diagram software and Flowchart maker
    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. 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.

    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!

    Design Inspiration

    Here are some websites to get inspiration for design and UI

    Website                            Description
    Behance Design projects featured by different creators
    Dribbble Design projects featured by different creators
    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.
    UI Movement UI Movement is a community of design enthusiasts who share and discuss the most interesting and unique UI designs
    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

    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)

    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
    Keyframes In-browser CSS Animation creator.
    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.
    Mobile/Responsive Web Design Tester Test responsive web designs or mobile pages that detect specific user agents. Test multiple devices at the same time!
    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.

    Others

    Uncategorized Stuff

    Website                            Description
    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 Resizer An interactive viewer that helps designers test material design breakpoints across desktop, mobile, and tablet
    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.
    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.
    Match Stick Visually compare your code and designs. Compare your mockups with your live website to pinpoint any missing details.
    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.

    项目简介

    🚀 Github 镜像仓库 🚀

    源项目地址

    https://github.com/bradtraversy/design-resources-for-developers

    发行版本

    当前项目没有发行版本

    贡献者 310

    全部贡献者

    开发语言