UI-UX-Resources

KO | EN

gitlite — search

#typescript #ai-agents #ai #dsh-plugin #deepseek-harness #open-source #claude-code #codex #cli #developer-tools #react #windows

UI-UX-Resources

★ 116 Open GitHub ↗

Find all the resources📘📙📕📗 related to UI/UX🎨, Html Templates, Fonts🖋, Icons, Photos Gallery📷, React⚛, Angular🅰, etc.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# _UI-UX Design Resources And Many More_ 🖌🎨

![headerimage](https://user-images.githubusercontent.com/69143883/94293824-858f2580-ff7c-11ea-935a-4c586a4e236e.png)

## _Table of content_

- _[UI Graphics](#ui-graphics)_
- _[Fonts](#fonts)_
- _[Colors](#colors)_
- _[Icons](#icons)_
- _[Favicons](#favicons)_
- _[Icon Fonts](#icon-fonts)_
- _[Stock Photos](#stock-photos)_
- _[Stock Videos](#stock-videos)_
- _[Stock Music & Sound Effects](#stock-music--sound-effects)_
- _[Vectors & Clip Art](#vectors--clip-art)_
- _[Product & Image Mockups](#product--image-mockups)_
- _[HTML & CSS Templates](#html--css-templates)_
- _[CSS Frameworks](#css-frameworks)_
- _[CSS Animations](#css-animations)_
- _[Javascript Animation Libraries](#javascript-animation-libraries)_
- _[UI Components & Kits](#ui-components--kits)_
- _[React UI](#react-ui)_
- _[Vue UI](#vue-ui)_
- _[Angular UI](#angular-ui)_
- _[Svelte UI](#svelte-ui)_
- _[Design Systems & Style Guides](#_design-systems--style-guide_s)_
- _[Online Design Tools](#online-design-tools)_
- _[Downloadable Design Software](#downloadable-design-software)_
- _[Design Inspiration](#design-inspiration)_
- _[Image Compression](#image-compression)_
- _[Chrome Extensions](#chrome-extensions)_
- _[YouTube Channels](#youtube-channels)_
- _[Others](#others)_

## _UI Graphics_

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

## _Fonts_

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

## _Colors_

> Websites and resources that help with choices related to colors

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                                    |
| -------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Colormind.io](http://colormind.io)                                                                      | Color palette generator                                                                                                                                        |
| [ColorCurves.app](https://colorcurves.app)                                                               | Color palette generator that uses curves to generate color palettes                                                                                            |
| [Coolors](https://coolors.co)                                                                            | Create the perfect palette or get inspired by thousands of beautiful color schemes                                                                             |
| [HTML Color Codes](https://htmlcolorcodes.com/)                                                          | Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names                                              |
| [Colors & Fonts](https://www.colorsandfonts.com/)                                                        | A curated library of colors, fonts and resources                                                                                                               |
| [Palette List](https://www.palettelist.com/)                                                             | Pick 2 colors you like and the tool generates thousands of palettes for you.                                                                                   |
| [Google Material Color Tool](https://material.io/resources/color/)                                       | Official Google Material Color Palette Tool                                                                                                                    |
| [Material Palette](https://www.materialpalette.com/)                                                     | Free to pick palettes, icons and colors for Material Design                                                                                                    |
| [ColorSpace](https://mycolor.space/)                                                                     | Generate nice color palettes from one color                                                                                                                    |
| [FlatUIColors](https://flatuicolors.com)                                                                 | Beautiful set of color palettes in various flavours                                                                                                            |
| [Adobe Color](https://color.adobe.com/create)                                                            | Create color palettes, extract gradients from images, etc                                                                                                      |
| [Colorsinspo](https://colorsinspo.com/)                                                                  | All-in-one resource for finding everything about colors                                                                                                        |
| [ColorsWall](https://colorswall.com/)                                                                    | Place to store your color palettes and generate palette in one click                                                                                           |
| [Happyhues](https://www.happyhues.co/)                                                                   | 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](https://color.adobe.com/trends)                                                           | Discover current color trends in different industries from the creative communities on Behance and Adobe Stock                                                 |
| [Color Hunt](https://colorhunt.co/)                                                                      | A free and open platform for color inspiration with thousands of trendy hand-picked color palettes                                                             |
| [Gradient Hunt](https://gradienthunt.com/)                                                               | A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients                                                         |
| [Web Gradients](https://webgradients.com/)                                                               | A free website to find good css gradients                                                                                                                      |
| [ColorBox](https://www.colorbox.io)                                                                      | A free website to produce color set                                                                                                                            |
| [CSS gradient](https://cssgradient.io/)                                                                  | A free website to make custome gradient and some examples of gradient                                                                                          |
| [gradienta](https://gradienta.io/)                                                                       | A pure css and jpg gradients                                                                                                                                   |
| [UI Gradients](https://uigradients.com/)                                                                 | UI gradients color generator                                                                                                                                   |
| [Palette Generator](https://palettegenerator.colorion.co/)                                               | Generate new color palette with every spacebar press                                                                                                           |
| [Material Palettes](https://material.colorion.co/)                                                       | 1000+ Material Design palettes                                                                                                                                 |
| [Grabient](https://www.grabient.com/)                                                                    | Gradient Selector                                                                                                                                              |
| [ShadeSwash](https://shadeswash.netlify.app/)                                                            | Quickly generate shades of any color                                                                                                                           |
| [BrandColors](http://brandcolors.net/)                                                                   | The biggest collection of official brand color codes                                                                                                           |
| [BRAND PALETTES](https://brandpalettes.com/)                                                             | Logo Color Codes and Palettes                                                                                                                                  |
| [Material Design Palette Generator](http://mcg.mbitson.com)                                              | Generate theme and color palette Material Design-like                                                                                                          |
| [Colorate](https://colorate.azurewebsites.net/)                                                          | Color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.                               |
| [0to255](https://www.0to255.com/)                                                                        | A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.                                     |
| [Color Blender](https://meyerweb.com/eric/tools/color-blend)                                             | A tool that shows the midpoint colors between two colors                                                                                                       |
| [Gradient Buttons](https://gradientbuttons.colorion.co/)                                                 | Ready to use copy/paste gradient buttons                                                                                                                       |
| [Khroma](http://khroma.co/)                                                                              | Khroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.                                            |
| [whocanuse](https://whocanuse.com)                                                                       | A tool that brings attention and understanding to how color contrast can affect different people with visual impairments.                                      |
| [Colorable](https://colorable.jxnblk.com/)                                                               | Color combination contrast tester                                                                                                                              |
| [Color Hex Picker](https://colorhexpicker.com)                                                           | Tool to get hex code along with name of the color.                                                                                                             |
| [Saruwakakun](https://saruwakakun.com/en/color-ideas)                                                    | The stunning color scheme for website & App Designs with previews                                                                                              |
| [Paletton](https://paletton.com/)                                                                        | Paletton.com is a designer color tool designed for creating color combinations that work together well.                                                        |
| [Colorzilla](https://www.colorzilla.com/)                                                                | A powerful online photoShop-like CSS gradient editor                                                                                                           |
| [Image Color Picker](https://image-color.com/)                                                           | Image color picker and palette generator                                                                                                                       |
| [CombineCOLORS](https://combinecolors.com/)                                                              | Color mixing tool                                                                                                                                              |
| [Color Lovers](https://www.colourlovers.com/palettes)                                                    | it will show the color schemes which are popular in outside world                                                                                              |
| [HTML CSS Color](https://www.htmlcsscolor.com/)                                                          | Free online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc.                                                          |
| [HEX Color Codes](https://hexcolorcodes.org/)                                                            | 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](https://webkul.github.io/coolhue/)                                                         | A free tool that shows different gradient examples in CSS and PNG format                                                                                       |
| [Colors.lol](https://colors.lol/)                                                                        | Interesting color palettes generated by a Twitter bot, there are hex codes and descriptive names for each color.                                               |

## _Icons_

> Resources for Icons including png, svg and more

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                                |
| -------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [UXWing](https://uxwing.com/)                                                                            | Well Optimized, Free icons for commercial use                                                                                                              |
| [Shapedfonts Iconclub](https://shapedfonts.com/iconclub/)                                                | 8000+ free icons                                                                                                                                           |
| [Feather Icons](https://feathericons.com/)                                                               | Beautiful, customizable open source icons                                                                                                                  |
| [Tabler Icons](https://tablericons.com/)                                                                 | 470+ highly customizable open source SVG icons                                                                                                             |
| [Simple Icons](https://simpleicons.org/)                                                                 | 1307 Free SVG icons for popular brands                                                                                                                     |
| [Instant Logo Search](http://instantlogosearch.com/)                                                     | thousands of free brands logos ( SVG - PNG )                                                                                                               |
| [Linear Icons](https://linearicons.com/free)                                                             | 1000+ Ultra crisp vector icons                                                                                                                             |
| [Icons8](https://icons8.com/)                                                                            | Free icons, photos, vectors and tools                                                                                                                      |
| [Flat Icon](https://www.flaticon.com/)                                                                   | The largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats                                                                               |
| [The Noun Project](https://thenounproject.com/)                                                          | Over 2 Million curated icons, created by a global community                                                                                                |
| [Iconscout](https://iconscout.com/)                                                                      | Free Download Icons illustrations stock photos at one place                                                                                                |
| [Nucleo App](https://nucleoapp.com/)                                                                     | 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](https://icon-icons.com/)                                                                | Free Icons PNG, ICO, ICNS and Vector file SVG                                                                                                              |
| [Bootstrap Icons](https://icons.getbootstrap.com/)                                                       | Free Icons built for Bootstrap but they'll work in any project                                                                                             |
| [Remix Icon](https://remixicon.com/)                                                                     | Simply Delightful Icon System                                                                                                                              |
| [Iconmonstr](https://iconmonstr.com/)                                                                    | Discover 4496+ free icons in 313 collections                                                                                                               |
| [Vivid.js](https://webkul.github.io/vivid/)                                                              | Ready to use Free and Open Source SVG Icons Pack JavaScript Library.                                                                                       |
| [Iconfinder](https://www.iconfinder.com/)                                                                | Free and premium vector icons in SVG, PNG, CSH and AI format                                                                                               |
| [Lordicon](https://lordicon.com/free-icons)                                                              | 50 free animated interactive icons                                                                                                                         |
| [UseAnimations](https://useanimations.com/)                                                              | Free Animated Icons in SVG and Json Format(for lottie)                                                                                                     |
| [css.gg](https://css.gg/)                                                                                | 700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API                                                         |
| [SVGPorn](https://svgporn.com)                                                                           | 1000+ high-quality SVG logos                                                                                                                               |
| [Payment System Logos](https://github.com/mpay24/payment-logos/)                                         | Logos for payment systems available in png and svg                                                                                                         |
| [Browser Logos](https://github.com/alrra/browser-logos/)                                                 | High resolution web browser logos                                                                                                                          |
| [IconBros](https://www.iconbros.com)                                                                     | 7843+ free icons grouped in 182 collections                                                                                                                |
| [LogoHub](https://logohub.io/)                                                                           | Generate and download your logo for free in PNG and SVG format                                                                                             |
| [Material Design Icons](https://materialdesignicons.com/)                                                | A icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project. |
| [Heroicons](https://heroicons.dev/)                                                                      | Free, open source icons from the creators of Tailwind CSS.                                                                                                 |
| [Zondicons](https://www.zondicons.com/icons.html)                                                        | A set of free premium SVG icons for you to use on your digital products.                                                                                   |
| [Endless Icons](http://endlessicons.com/)                                                                | A website offering a number of free icons. Icons are tagged and also compressed into kits.                                                                 |
| [Icomoon](https://icomoon.io/app/)                                                                       | Browse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.                                                                       |
| [Eva Icons](https://akveo.github.io/eva-icons/#/)                                                        | Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.                                                   |
| [Cryptoicons](http://cryptoicons.co/)                                                                    | A set of 430 crypto and fiat currency icons. Completely free.                                                                                              |
| [Ikonate](https://ikonate.com/)                                                                          | Fully customisable & accessible vector icons                                                                                                               |
| [appicon](https://appicon.co/)                                                                           | Quickly generate app icons in diffrent sizes for your IOS, macOS and Android projects                                                                      |
| [LineIcons](https://lineicons.com)                                                                       | 2000+ Essential Line Icons for Designers and Developers                                                                                                    |
| [Evericons](https://www.figma.com/resources/assets/evericons-for-figma/)                                 | Evericons is a big pack of over 460 free icons designed by Aleksey Popov.                                                                                  |
| [SVG Repo](https://www.svgrepo.com/)                                                                     | Download free SVG Vectors for commercial use.                                                                                                              |
| [Convertio](https://convertio.co/png-svg/)                                                               | Convert PNG files to SVG online & free. (One of the services provided by it.)                                                                              |
| [CSS ICON](https://cssicon.space/)                                                                       | Icon set made with pure css code, no dependencies, "grab and go" icons                                                                                     |
| [Unified icons](https://iconify.design/)                                                                 | Thousands of icons, one unified framework. One library, over 40,000 vector icons.                                                                          |

## _Favicons_

> Resources for Favicons

## _Icon Fonts_

> Resources for Icon Fonts

## _Stock Photos_

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

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                                                 |
| -------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Pexels](https://www.pexels.com/)                                                                        | Free stock photos shared by talented creators                                                                                                                               |
| [Unsplash](https://unsplash.com/)                                                                        | The internet’s source of freely usable images                                                                                                                               |
| [Pixabay](https://pixabay.com/)                                                                          | Over 1.7 million+ high quality stock images and videos                                                                                                                      |
| [Magdeleine](https://magdeleine.co/)                                                                     | Gallery & free high res photo everyday                                                                                                                                      |
| [Picspree](https://picspree.com)                                                                         | Royalty free images, stock photos, illustrations, and vectors                                                                                                               |
| [Burst](https://burst.shopify.com/)                                                                      | Free stock photos collections                                                                                                                                               |
| [Gratisography](https://gratisography.com/)                                                              | Free collection of free high-resolution pictures                                                                                                                            |
| [Life of Pix](https://www.lifeofpix.com/)                                                                | Free high resolution photography                                                                                                                                            |
| [Stock Snap](https://stocksnap.io/)                                                                      | Hundreds of high quality photos added weekly                                                                                                                                |
| [Morguefile](https://morguefile.com/)                                                                    | Over 350,000 free stock photos for commercial use                                                                                                                           |
| [Kaboom Pics](https://kaboompics.com/)                                                                   | Stock photography and color palettes. Good for product images                                                                                                               |
| [New Old Stock](https://nos.twnsnd.co/)                                                                  | Stock vintage photos                                                                                                                                                        |
| [Pic Jumbo](https://picjumbo.com/)                                                                       | Good collections of different types of photos                                                                                                                               |
| [Public Domain Pictures](https://www.publicdomainpictures.net/en/)                                       | Public domain images of all types                                                                                                                                           |
| [Find A Photo](https://www.chamberofcommerce.org/findaphoto/)                                            | Searches multiple stock photo websites                                                                                                                                      |
| [Stockvault](http://www.stockvault.net/)                                                                 | Categorized stock photos                                                                                                                                                    |
| [Placeholder](https://placeholder.com/)                                                                  | A free image placeholder service for the web. You can specify image size and format                                                                                         |
| [Realistic Shots](https://realisticshots.com/)                                                           | Free high resolution stock photos                                                                                                                                           |
| [Negative Space](https://negativespace.co/)                                                              | High-Resolution Free Stock Photos                                                                                                                                           |
| [SkitterPhoto](https://skitterphoto.com/)                                                                | Free high resolution photography                                                                                                                                            |
| [PicoGraphy](https://picography.co/)                                                                     | Gorgeous, High-Resolution, Free Photos                                                                                                                                      |
| [Wunder Stock](https://wunderstock.com/)                                                                 | Stunningly amazing free photos                                                                                                                                              |
| [PxHere](https://pxhere.com/)                                                                            | Free Images & Free stock photos - PxHere                                                                                                                                    |
| [Piqsels](https://piqsels.com/)                                                                          | Royalty Free Stock Photos                                                                                                                                                   |
| [FoodiesFeed](https://www.foodiesfeed.com/)                                                              | Food photo stock                                                                                                                                                            |
| [Nappy](https://www.nappy.co/)                                                                           | A website offering Beautiful, high-res photos of black and brown people.                                                                                                    |
| [Generated Photos](https://generated.photos/)                                                            | Unique AI Generated model photos                                                                                                                                            |
| [Reshot](https://www.reshot.com/)                                                                        | Uniquely free photos. Handpicked, non-stocky images.                                                                                                                        |
| [Free Images](https://www.freeimages.com/)                                                               | Find and download free stock photos - all free for personal and commercial use                                                                                              |
| [Lorem Picsum](https://picsum.photos/)                                                                   | An easy to use API to get beautiful placeholder images. Size and other parameters can be specified.                                                                         |
| [scienceimage](https://www.scienceimage.csiro.au)                                                        | An image library specializing in science and nature images                                                                                                                  |
| [Integration & Application Network Image Library](https://ian.umces.edu/imagelibrary)                    | Free images to provide scientists, resource managers, government agencies, community groups and graphics professionals with a resource for enhancing science communication. |
| [Saxifraga](http://www.freenatureimages.eu)                                                              | Free nature images                                                                                                                                                          |

## _Stock Videos_

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

## Stock Music & Sound Effects

> Websites that offer free stock music and/or sound effects

## _Vectors & Clip Art_

> Free vectors, clipart, illustrations, patterns and more

## _Product & Image Mockups_

> Create mockups of devices and other products

## _HTML & CSS Templates_

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

## CSS Frameworks

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

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                                 |
| -------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Tailwind CSS](https://tailwindcss.com/)                                                                 | Low level, utility-first framework                                                                                                                          |
| [Bootstrap](https://getbootstrap.com/)                                                                   | Popular UI framework with tons of components that use both CSS and JS                                                                                       |
| [Materialize](https://materializecss.com/)                                                               | A modern responsive front-end framework based on Material Design                                                                                            |
| [Material Design Lite](https://getmdl.io/)                                                               | Light framework based on Material Design. No JS dependency                                                                                                  |
| [Bulma](https://bulma.io/)                                                                               | Modern CSS framework with no JS                                                                                                                             |
| [Skeleton](http://getskeleton.com/)                                                                      | Extremely light framework for basic UI elements                                                                                                             |
| [Semantic UI](https://semantic-ui.com/)                                                                  | Empowers designers and developers by creating a shared vocabulary for UI                                                                                    |
| [Fomantic UI](https://fomantic-ui.com/)                                                                  | A community fork of Semantic-UI                                                                                                                             |
| [Foundation](https://get.foundation/)                                                                    | Mobile first framework with clean markup                                                                                                                    |
| [Pure CSS](https://purecss.io/)                                                                          | A set of small, responsive CSS modules                                                                                                                      |
| [UIKit](https://getuikit.com/)                                                                           | Lightweight and modular front-end framework                                                                                                                 |
| [Susy](https://www.oddbird.net/susy/)                                                                    | Lightweight, grid-layout engine for Sass                                                                                                                    |
| [Milligram.io](https://milligram.io/)                                                                    | Minimalist CSS framework                                                                                                                                    |
| [Vanilla Framework](https://vanillaframework.io/)                                                        | Simple, extensible CSS framework written in Sass                                                                                                            |
| [Spectre CSS](https://picturepan2.github.io/spectre/)                                                    | Lightweight, modern CSS framework                                                                                                                           |
| [Picnic CSS](https://picnicss.com/)                                                                      | Lightweight and beautiful library                                                                                                                           |
| [Wing](https://kbrsh.github.io/wing/)                                                                    | A beautiful CSS framework designed for minimalists                                                                                                          |
| [Chota](https://jenil.github.io/chota/)                                                                  | A micro (~3kb) CSS framework                                                                                                                                |
| [Blueprint CSS](https://blueprintcss.dev/)                                                               | A lightweight layout library for building great responsive mobile first UIs that work everywhere                                                            |
| [W3.CSS](https://www.w3schools.com/w3css/)                                                               | 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](https://jdan.github.io/98.css/)                                                                 | A design system for building faithful recreations of old UIs                                                                                                |
| [NES CSS](https://nostalgic-css.github.io/NES.css/)                                                      | NES-style CSS Framework                                                                                                                                     |
| [Shoelace.css](https://www.shoelace.style/)                                                              | Lightweight, forward-thinking CSS library built with future CSS syntax                                                                                      |
| [MVP.css](https://andybrewer.github.io/mvp/)                                                             | A minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you're done                                                |
| [Blaze.css](http://blazecss.com/)                                                                        | Open source modular CSS toolkit providing great structure for building websites quickly                                                                     |
| [Turret CSS](https://turretcss.com/)                                                                     | Turret CSS is a styles framework for development of responsive websites.                                                                                    |
| [Cutestrap](https://www.cutestrap.com/)                                                                  | A strong, independent CSS Framework.                                                                                                                        |
| [Shorthand](https://shorthandcss.com/)                                                                   | Shorthand is a free and open source css framework, that allows you to make unique and modern design without writing any css                                 |
| [XP.css](https://botoxparty.github.io/XP.css/)                                                           | XP.css is an extention of 98.css. A CSS library for building interfaces that look like old UIs.                                                             |
| [Framework7](https://framework7.io/)                                                                     | Framework7 - is a free and open source framework to develop mobile, desktop or web apps with native look and feel.                                          |
| [Hint.css](https://kushagra.dev/lab/hint/)                                                               | A pure CSS tooltip library for your lovely websites.                                                                                                        |
| [imagehover.io](http://imagehover.io/)                                                                   | Pure CSS Image Hover Effect Library                                                                                                                         |
| [mini.css](https://minicss.org/)                                                                         | minimal, responsive, style-agnostic CSS framework                                                                                                           |
| [Tachyons](https://tachyons.io/)                                                                         | Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible.                                                        |
| [Material Bootstrap](https://fezvrasta.github.io/bootstrap-material-design/)                             | Material Design with Bootstrap                                                                                                                              |
| [Ivory](https://github.com/IVORY-UI/ivory)                                                               | A modern CSS framework for developing powerful web interfaces faster and easier                                                                             |
| [Halfmoon UI](https://www.gethalfmoon.com/)                                                              | A responsive and lightweight framework, designed for quickly building beautiful dashboards and product pages.                                               |
| [Metro 4](https://metroui.org.ua/index.html)                                                             | Create your site quickly and effectively with Metro 4. impressive components library built on html, css, javascript.                                        |

## _CSS Animations_

> CSS animations to build awesome animations for websites and applications

## _Javascript Animation Libraries_

> javascript animations libraries to build awesome animations for websites and applications

## UI Components & Kits

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

## _React UI_

> UI and component libraries for the React JavaScript framework

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                  |
| -------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
| [Material UI](https://material-ui.com/)                                                                  | React components for faster and easier web development, based on Material Design                                                             |
| [Chakra UI](https://chakra-ui.com/)                                                                      | Build accessible React apps & websites with speed. [Openchakra](https://openchakra.app/)                                                     |
| [React Bootstrap](https://react-bootstrap.github.io/)                                                    | Bootstrap rebuilt for React. Include Bootstrap components right in your JavaScript                                                           |
| [ui-playbook](https://uiplaybook.dev/)                                                                   | The documented collection of UI components                                                                                                   |
| [ReactStrap](https://reactstrap.github.io/)                                                              | Another Bootstrap UI library for React                                                                                                       |
| [React Admin](https://marmelab.com/react-admin/)                                                         | A frontend Framework for building admin applications. Supports API's out of the box                                                          |
| [BlueprintJS](https://blueprintjs.com/)                                                                  | React-based UI toolkit for the web                                                                                                           |
| [React Semantic UI](https://react.semantic-ui.com/)                                                      | UI components based off of the Semantic UI framework                                                                                         |
| [Shards React](https://designrevision.com/downloads/shards-react/)                                       | React UI kit featuring a modern design system with dozens of custom components                                                               |
| [React Virtualized](https://bvaughn.github.io/react-virtualized)                                         | UI set for data. Includes tables, lists, sorting, etc.                                                                                       |
| [React Toolbox](http://react-toolbox.io/#/)                                                              | Material design UI library for React                                                                                                         |
| [Elastic UI](https://elastic.github.io/eui/#/)                                                           | Distributes UI React components and static assets for use in building web layouts                                                            |
| [React Desktop](http://reactdesktop.js.org/)                                                             | Desktop styled components in React. Includes MacOS and Windows based components                                                              |
| [Theme UI](https://theme-ui.com/home)                                                                    | Build consistent, themeable React apps based on constraint-based design principles                                                           |
| [Onsen React](https://onsen.io/react/)                                                                   | Distributes Components for hybrid mobile apps with React and Onsen UI                                                                        |
| [Evergreen](https://evergreen.segment.com/)                                                              | Design system for React                                                                                                                      |
| [Rebass](https://rebassjs.org/)                                                                          | React primitive UI components built with styled system                                                                                       |
| [Grommet](https://v2.grommet.io/)                                                                        | mobile first UI component library                                                                                                            |
| [Rimble](https://rimble.consensys.design/)                                                               | React design kit, library and guides                                                                                                         |
| [Landing Page Template](https://github.com/cruip/open-react-template/)                                   | Open source landing page template for react                                                                                                  |
| [Elemental UI](http://elemental-ui.com/)                                                                 | A UI Toolkit for React.js Websites and Apps                                                                                                  |
| [Ant Design](https://ant.design/)                                                                        | Open source design React ui library.                                                                                                         |
| [Bumbag](https://bumbag.style/)                                                                          | Bumbag is a friendly React UI Kit suitable for MVPs or large-scale applications.                                                             |
| [PRIMEREACT](https://www.primefaces.org/primereact/)                                                     | The ultimate collection of design-agnostic, flexible and accessible React UI Components                                                      |
| [Primer Components](https://primer.style/components/)                                                    | Primer Components are React components which implement GitHub's Primer Design System                                                         |
| [Orbit](https://orbit.kiwi/)                                                                             | Design system and React UI components for travel projects.                                                                                   |
| [Base Web](https://baseweb.design/)                                                                      | Base Web provides a robust suite of components out of the box                                                                                |
| [Backpack UI](http://lonelyplanet.github.io/backpack-ui/?path=/story/styles--design-tokens)              | Backpack is the Lonely Planet toolset that we use to build front end apps.                                                                   |
| [Reaviz](https://reaviz.io)                                                                              | Data visualization library for React based on D3                                                                                             |
| [React Suite](https://rsuitejs.com/en/)                                                                  | A suite of React components, sensible UI design, and a friendly development experience.                                                      |
| [React Spring](https://www.react-spring.io/)                                                             | Spring-physics based animation library for React applications.                                                                               |
| [Recharts](http://recharts.org/en-US/)                                                                   | A composable charting library built on React components.                                                                                     |
| [Vercel UI](https://github.com/zeit-ui/react)                                                            | Modern and minimalist React UI library                                                                                                       |
| [Framer Motion](https://www.framer.com/motion/)                                                          | A React library to power production-ready animations.                                                                                        |
| [React Spectrum](https://react-spectrum.adobe.com/react-spectrum/index.html)                             | A React implementation of Spectrum, Adobe’s design system.                                                                                   |
| [React tsParticles](https://particles.matteobruni.it/)                                                   | A lightweight React component for creating particles                                                                                         |
| [particles-bg](https://github.com/lindelof/particles-bg)                                                 | A React particles animation background component                                                                                             |
| [Material Kit React](https://www.codeinwp.com/blog/react-ui-component-libraries-frameworks/)             | Created with inspiration from Google’s Material Design, Material Kit React builds a set of elements that put consistency as the main feature |

## _Vue UI_

> UI and component libraries for the Vue JavaScript framework

## _Angular UI_

> UI and component libraries for the Angular JavaScript framework

## Svelte UI

> UI and component libraries for the Svelte Javascript compiler

## \_Design Systems & Style Guide_s

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

## _Online Design Tools_

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

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                      |
| -------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
| [Figma](https://www.figma.com/graphic-design-tool/)                                                      | Online graphic design tool (Free & paid options)                                                                                 |
| [Vectr](https://vectr.com/)                                                                              | Free vector graphics software                                                                                                    |
| [Taler](https://www.taler.app/)                                                                          | Create social media banner designs in minutes from hundreds of customizable templates                                            |
| [Canva](https://www.canva.com/)                                                                          | Create beautiful designs (Free & Paid)                                                                                           |
| [Get Waves](https://getwaves.io/)                                                                        | A free SVG wave generator to make unique SVG waves for web design                                                                |
| [Clippy](https://bennettfeely.com/clippy/)                                                               | Easy CSS clip-path maker                                                                                                         |
| [Fancy Border Radius](https://9elements.github.io/fancy-border-radius/full-control.html)                 | Eight values specifying border-radius in CSS ( border-radius generator )                                                         |
| [Wireframe.cc](https://wireframe.cc/)                                                                    | Wireframing tool (free & paid)                                                                                                   |
| [Fotor](https://www.fotor.com/)                                                                          | Photo editor and design maker                                                                                                    |
| [Pixlr](https://www.pixlr.com/)                                                                          | Online photo editor                                                                                                              |
| [Animoto Video Maker](https://animoto.com/apps/online-video-maker)                                       | Make videos online                                                                                                               |
| [RemoveBG](https://www.remove.bg/)                                                                       | Remove image backgrounds                                                                                                         |
| [Photo Creator](https://photos.icons8.com/creator)                                                       | Create your own photos instead of searching for stock                                                                            |
| [Visme](https://www.visme.co/)                                                                           | Create presentations, infographics and more                                                                                      |
| [Infogram](https://infogram.com/)                                                                        | Create infograms                                                                                                                 |
| [ChartGo](https://www.chartgo.com/)                                                                      | Create charts and graphs online                                                                                                  |
| [Cartoon Photo](https://cartoon.pho.to/)                                                                 | Turn photos into cartoons                                                                                                        |
| [Logo Maker](https://logomakr.com/)                                                                      | Create custom logos                                                                                                              |
| [Whimsical](https://whimsical.com/)                                                                      | Wireframes, diagrams and more (4 free)                                                                                           |
| [Whiteboard](https://witeboard.com/)                                                                     | Online drawing tool                                                                                                              |
| [Octopus](https://octopus.do/)                                                                           | Sitemap builder                                                                                                                  |
| [CTA Button Maker](https://www.clickminded.com/button-generator/)                                        | Create call to action buttons                                                                                                    |
| [Blobmaker](https://www.blobmaker.app/)                                                                  | Blobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes            |
| [Personas](https://personas.draftbit.com/)                                                               | A playful avatar generator for the modern age                                                                                    |
| [SoftUI](https://www.softui.io)                                                                          | A Soft UI (neumorphism) CSS generator                                                                                            |
| [Photopea](https://www.photopea.com)                                                                     | A Online Photoshop editor                                                                                                        |
| [Excalidraw](https://excalidraw.com/)                                                                    | Virtual whiteboard for sketching hand-drawn like diagrams                                                                        |
| [Diagrams](https://www.diagrams.net/)                                                                    | Diagram software and Flowchart maker                                                                                             |
| [MapInSeconds](http://mapinseconds.com/)                                                                 | Simple way to visualize your data with a map                                                                                     |
| [Grid Malven](http://grid.malven.co/)                                                                    | A css grid cheatsheet to reference when creating a css grid                                                                      |
| [Flex Malven](http://flexbox.malven.co/)                                                                 | A flexbox grid cheatsheet to reference when working with flexbox                                                                 |
| [Smart Upscaler](https://icons8.com/upscaler)                                                            | Upscale images by 2-4x resolution                                                                                                |
| [GetAvataaars](https://getavataaars.com/)                                                                | Fun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch library                              |
| [Big Heads](https://github.com/RobertBroersma/bigheads)                                                  | Easily generate avatars for your projects with Big Heads by Robert Broersma.                                                     |
| [Webflow](https://webflow.com/)                                                                          | Break the code barrier, Build better business websites, faster. Without coding.                                                  |
| [Trace](https://stickermule.com/trace)                                                                   | Instantly remove the background from your photos                                                                                 |
| [Neumorphism.io](https://neumorphism.io/#55b9f3)                                                         | Generate Soft-UI CSS shadow code                                                                                                 |
| [DB Designer](https://app.dbdesigner.net/)                                                               | Design your database for free online                                                                                             |
| [Ui Bakery](https://uibakery.io/)                                                                        | Create full-fledged web apps visually                                                                                            |
| [Faux](http://knutsynstad.com/fauxcode/)                                                                 | Turn real code into faux code                                                                                                    |
| [Rive](https://rive.app/)                                                                                | Real-time interactive design tool that allows you to design, animate, and immediately integrate your assets into any platform.   |
| [Unscreen](https://www.unscreen.com/)                                                                    | Remove Video Background 100% Automatically and Free                                                                              |
| [Kodeshot](https://www.kodeshot.net/)                                                                    | Convert your source code into nice pictures for your articles, tweets, messages, posts...                                        |
| [Wix](https://www.wix.com/)                                                                              | Create a Website You’re Proud Of                                                                                                 |
| [GTmetrix](https://gtmetrix.com/)                                                                        | Website Speed and Performance Optimization                                                                                       |
| [Framer](https://www.framer.com/)                                                                        | Is prototyping tool for teams                                                                                                    |
| [Draw.io](https://www.draw.io/)                                                                          | Free online diagram editor tool                                                                                                  |
| [UXWing SVG Editor](https://uxwing.com/svg-icon-editor)                                                  | Creating and Edit SVG Online                                                                                                     |
| [CSS Arrow](http://www.cssarrowplease.com/)                                                              | Create and export CSS code for a custom box with an arrow extending out from the side. Great for tooltips, flyouts and the like. |
| [Simple Image Resizer](http://www.simpleimageresizer.com/)                                               | Simple Image Resizer, resize online images without losing quality                                                                |
| [Aspect Ratio Calculator](https://andrew.hedges.name/experiments/aspect_ratio/)                          | Simple and easy way of calculating aspect ratios for resizing your images or videos                                              |

## _Downloadable Design Software_

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

## _Design Inspiration_

> Here are some websites to get inspiration for design and UI

| Website&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; | Description                                                                                                                                                                                                                                                                                         |
| -------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Behance](https://www.behance.net/)                                                                      | Design projects featured by different creators                                                                                                                                                                                                                                                      |
| [Dribbble](https://dribbble.com/)                                                                        | Design projects featured by different creators                                                                                                                                                                                                                                                      |
| [Httpster](https://httpster.net/2020/apr/)                                                               | Showcases websites made by people from all over the world                                                                                                                                                                                                                                           |
| [Microcopy Inspirations](https://www.microcopyinspirations.com/)                                         | Curated collection of UX writing examples, microcopy examples and copywriting examples                                                                                                                                                                                                              |
| [Inspofinds](https://inspofinds.com/)                                                                    | Latest design work from designers and the design community                                                                                                                                                                                                                                          |
| [Design Notes](https://www.designnotes.co/)                                                              | Free online resource library for product designers                                                                                                                                                                                                                                                  |
| [Land Book](https://land-book.com/)                                                                      | Displays a large collection of websites to help find inspiration                                                                                                                                                                                                                                    |
| [Frontend Mentor](https://www.frontendmentor.io/)                                                        | Real-world UI Challenges using HTML, CSS and Javascript                                                                                                                                                                                                                                             |
| [Awwwards](https://www.awwwards.com/)                                                                    | A website that rate and collects the best websites in the world in UI                                                                                                                                                                                                                               |
| [Codrops](https://tympanus.net/codrops/)                                                                 | A website that collects the best UI ideas and patterns and make tutorials of it                                                                                                                                                                                                                     |
| [SaaS Landing Page](https://saaslandingpage.com/)                                                        | Discover the best landing page examples created by top-class SaaS companies                                                                                                                                                                                                                         |
| [Pages.xyz](https://www.pages.xyz/)                                                                      | Curate and discover the best designed web pages                                                                                                                                                                                                                                                     |
| [UI Movement](https://uimovement.com/)                                                                   | UI Movement is a community of design enthusiasts who share and discuss the most interesting and unique UI designs                                                                                                                                                                                   |
| [lapa ninja](https://www.lapa.ninja/)                                                                    | Best landing page inspiration                                                                                                                                                                                                                                                                       |
| [Freefrontend](https://freefrontend.com/)                                                                | Free front end design from css html and javascript. latest work some design part                                                                                                                                                                                                                    |
| [Webframe](https://webframe.xyz)                                                                         | Discover and be inspired by beautiful webapp designs                                                                                                                                                                                                                                                |
| [Collect UI](http://collectui.com/)                                                                      | Daily inspiration collected from daily ui archive and beyond. Hand picked, and updating daily.                                                                                                                                                                                                      |
| [Graphic Burger](https://graphicburger.com/)                                                             | 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](https://reallygoodemails.com/)                                                      | A site offering users a ton of company e-mails from customer service to marketing.                                                                                                                                                                                                                  |
| [Free Design Resource](https://freedesignresources.net/)                                                 | A site offering fonts, mockups, templates graphics and ui kits.                                                                                                                                                                                                                                     |
| [Site Inspire](https://www.siteinspire.com/)                                                             | siteInspire is a showcase of the finest web and interactive design.                                                                                                                                                                                                                                 |
| [Web Design Inspiration](https://www.webdesign-inspiration.com/)                                         | A site for web design inspiration, updated daily.                                                                                                                                                                                                                                                   |
| [NavNav](https://navnav.co/)                                                                             | Responsive navigation examples                                                                                                                                                                                                                                                                      |
| [Calltoidea](https://www.calltoidea.com/)                                                                | Collection of different web Components for inspiration.                                                                                                                                                                                                                                             |
| [MediaQueri.es](https://mediaqueri.es/)                                                                  | A collection of inspirational websites using media queries and responsive web design                                                                                                                                                                                                                |
| [Mulzli Search](https://search.muz.li)                                                                   | Search engine for design inspiration                                                                                                                                                                                                                                                                |
| [DeviantArt](https://www.deviantart.com/)                                                                | Access to 370 million pieces of art for inspiration.                                                                                                                                                                                                                                                |
| [Design your way](https://www.designyourway.net/blog/web-and-mobile-design/)                             | Collection of different Web and Mobile Designs                                                                                                                                                                                                                                                      |
| [Three.js](https://threejs.org/)                                                                         | Collection of best and award winning websites that were built using three.js JavaScript library                                                                                                                                                                                                     |

## _Image Compression_

> Websites that allow you to compress large images

## Chrome Extensions

> Useful Chrome extensions for Designers and Web-Developers.

## _YouTube Channels_

> YouTube channel that allow you to gain knowledge

## Others

> Uncategorized Stuff

UI-UX-Resources

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README