LICENSE | ||
readme.md |
Design Resources For Developers
A curated list of FREE design & UI resources for developers including stock photos, templates, frameworks, UI Kits, online tools and much much more.
- UI Graphics
- Fonts
- Icons
- Stock Photos
- Stock Videos
- Vectors & Clipart
- Product & Image Mockups
- HTML & CSS Templates
- CSS Frameworks
- CSS Components & Kits
- React UI Libraries
- Vue UI Libraries
- Angular UI Libraries
- Design Systems & Style Guides
- Online Design Tools
- Downloadable Design Software
- UI & Design Inspiration
- Adding To This Repo
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 |
Drawkit.io | Illustrations for designers and startups |
Undraw.co | Open-source illustrations for any idea you can imagine and create. |
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. |
animations.co | Beautiful, customizable animated GIF icons |
animations.co | Beautiful, customizable animated GIF icons |
Speckyboy Article | The 10 most popular open source frontend web UI kits |
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 |
What Font | Tool for finding the fonts of a website without having to search in the devtools |
Tiff | A type diff tool that visually contrasts the differences between two fonts. |
Font Flame | Tool for pairing fonts to see how they look together |
TypeKit Practice | Learn about typography practices |
Icons
Resources for Icons including font based, png, svg and more
Website | Description |
---|---|
Font Awesome | The web's most popular icon set and toolkit. |
Material Icons | Material design icon library |
Shapedfonts Iconclub | 8000+ free icons |
Feather Icons | Beautiful, customizable open source icons |
Simple Icons | 1307 Free SVG icons for popular brands |
Zurb Foundation Icons | Customizable Foundation icons |
Linear Icons | 1000+ Ultra crisp vector icons |
Entypo | 411 carefully crafted premium pictograms by Daniel Bruce |
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 |
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 res photo everyday |
Picspree | Royalty free images, stock photos, illustrations, and vectors |
Burst | Free stock photos collections |
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 palletes. 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 |
Stock Videos
Websites that offer free stock videos of all kinds for your websites and apps
Website | Description |
---|---|
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 |
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 |
Product and Image Mockups
Create mockups of devices and other products
Website | Description |
---|---|
Smart Mockups | Create stunning product mockups (free & premium) |
Shot Snap | Create beautiful device mockup images for your app or website design |
Screely | Instantly turn your screenshot into a mockup |
Screen Peak | Create a mockup from a URL |
Mockup Wolrd | The biggest source of free photo-realistic Mockups online |
Collab Shot | Real-time screen grabs and image sharing |
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 |
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. |
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 |
UI and CSS Components & Kits
Not quite "frameworks", but tools for creating user interfaces with comoponents or UI kits
Website | Description |
---|---|
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 |
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 |
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 |
React Bootstrap | Bootstrap rebuilt for React. Include Bootstrap components right in your JavaScript |
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 |
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 |
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 |
Quasar | Build high-performance VueJS user interfaces in record time |
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. |
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 |
Design Systems and 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 |
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 |
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 |
Online Design Tools
All kinds of online tools for design, from photo editors to wireframing, color generators and more
Website | Description |
---|---|
Figma | Online graphic design tool (Free & paid options) |
Vectr | Free vector graphics software |
Canva | Create beautiful designs (Free & Paid) |
Wireframe.cc | Wireframing tool (free & paid) |
Fotor | Photo editor and design maker |
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 |
Colors | Color schemes generator |
Logo Maker | Create custom logos |
Whimsical | Wireframes, diagrams and more (4 free) |
Whiteboard | Online drawing tool |
Octopus | Sitemap builder |
Favicon Generator | Generate favicon ico files for your website |
CTA Button Maker | Create call to action buttons |
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 |
UI and Design Inspiration
Here are some websites to get inspiration for design and UI
Website | Description |
---|---|
Behance | Design projects featured by different creators |
Dribble | Design projects featured by different creators |
Httpster | Showcases websites made by people from all over the world |
Microcopy Inspirations | Curated collection of ux writing examples, microcopy examples and copywriting examples |
Inspofinds | Latest design work from designers and the design community. |
Design Notes | Free online resource library for product designers |
Adding To This Repo
Feel free to make a pull request and add more resources to this repo. The only requirements are that anything you add has to be FREE and put in the correct category