MENU
Latest free & paid resources for web developers & designers that are very useful. Increase development & design works speed. We have been working on this fields since a long period of time and as a developer, we know it can be tough to find good resources as far as creating websites and user interfaces and we also know that there's a lot of really really great developers that aren't that good with design.
Latest free & paid resources for web developers & designers that are very useful. Increase development & design works speed.
We have been working on this fields since a long period of time and as a developer, we know it can be tough to find good resources as far as creating websites and user interfaces. Also, we know that there’s a lot of really really great developers that aren’t that good with design. And, to be sure that whatever you add is free, you can make a pull request. Put it in the right category.
For sure, it is not already here. So, there are the categories we know about. Ui graphics, fonts, icons, stock videos and photos, vector, HTML, CSS, templates, frameworks, CSS frameworks, react view and angular, UI libraries design systems and style guides, online design tools, and downloadable software.
In addition, here we will be going through some of these. Additionally, UI graphics is going to be your sketch Figma, PSD files, and so on. Ui design is really one of the best. Not to mention, there are thousands of best modern looking Ui components and you can easily download the files if you want.
But, copying the whole template is not the best idea. Rather than copying, using it as an inspiration can be better. In other words, while creating something like a login page, you can just look at the template and try to recreate it with HTML and CSS.
Likewise, there are some others too and this one has the Figma uh design elements and screens stuff like infographics. Humans, which is a library of the people illustrations are seen to be the design trend in this period. Also, you can pattern the same thing and can also download this for you.
Also, try to know about all these different software platforms. We have got uh animation.co here so that you can easily create different gif icons animations.
After that, we have google fonts. Google Fonts is one of the most popular fonts. Not to mention, there are some other font sites too which are worth checking out. Additionally, there are also some tools to find out what fonts are on the web page without having to go to the dev tools.
You will get the tiff there which you can easily compare and contrast different fonts. Moreover, you can also put them on top of each other and compare them. Font Awesome is also one of the best with material icon features. Not to mention, there you can find different sets of fonts that you can easily customize. In addition, you can easily use them by downloading the package.
Moreover, we have general style guides and a design system like google’s material design. But, there are several different companies like apple. so these are the apple design resources, Thus, it tells you a lot about whatever design philosophy and stuff like that.
In addition, you can also download the files and there are a lot of codes that you can use. Not pretty sure about the apple but if you go to the audio you will get the exact resource information like the size and the exact colors. There is the GitHub repo for it.
Not sure about the exact guidelines on how to use this stuff of the design systems from companies like that. In addition, it is absolutely free to use on whatever you want but there are generalized systems like this and design. Also, there are actually like and react view components that you can use with the system.
Etrade Microsoft fluent UI also looks pretty cool. So, this is similar to the Microsoft framework or the design system Pluralsight Mozilla protocol. This is the design system for the Mozilla and the firefox websites. Thus, it is really good and even if you don’t use it directly, you can get some ideas fro it. In addition, we have some of the online design tools like Figma. Figma is one of the popular online design tools.
Similarly, there are free as well as paid version options. So, if you want to create the website wireframe here, you can easily do that. Some of these might be free and free as well. If you want to remove the background from the image you can simply use this tool. A lot of these are just a small tool.
There are a bunch of stock photos and its absolutely free. For best stock photos there are several sites like pixels and Unsplash. Also, these sites have thousands of high-quality photos.
Similarly, you can easily search for the desired quality photos on the basis of color, size, quality, etc. Like stock photos, there are several stock video websites too. Also, you can search the video you want and download and use it for free.
Additionally, we have some different stock videos websites, vectors, and clip art. If you also want stuff like icons and images, you can easily get there. Many vector sites are somehow similar but they all have different resources packs. For example, if you are creating an e-commerce website. There you will need some products and images. Thus, you can easily find the images of the categories that you are searching for in vector websites.
Now, let’s have a look at HTML CSS templates. So, html5 up has a lot of different and nest templates. Template mo color lib, one of the best templates is pretty cool. Not to mention, you can find several categories like real estate, banks, hospitals, restaurants. So, when you visit the site and have a look at templates, you might want to download one of those. We are pretty sure that some of the guys know a lot about this tailwind bootstrap material.
Boostrap and some of the other popular ones tend to be heavy. Then we really have Ui and CSS components and kits. There aren’t frameworks that are lighter and also give you the best.
Notably, there are several uh UI components, some with javascript functionality design blocks. We thought that was pretty cool. These are not the images, these are like the CSS components that you can download and use.
Here, we have stuff for the react so material UI chakra react-bootstrap. It is a pretty cool framework for building admin applications or admin interfaces. Not to mention, it directly works with APIs like any JSON API or firebase. It is too buffy based on the Bulma, the Bulma CSS framework. Some other stuff here quasar angular so we have a material angular bootstrap. In summarize, If you want to use bootstrap with angular then it can be really cool.
First specific things logo maker color scheme generator. So, if you want to generate the color scheme that makes sense, you can make a palette uh. If you want to build out the site map you can use it to build out database tables and the stuff as a visualization whiteboard online drawing tool.
That’s why some of these might not be that useful. Similarly, if you want to make a cartoon photo of you know a real photograph and downloadable design software gimp that is very similar to photoshop. But, free blender for 3D modeling some of the other ones here pencil project and then some of the inspiration like the dribble and some of the other sites that I found. In addition, there are tons of stuff and here you can find something that is very useful.
Resources and websites with modern UI components in different formats such as PSD, Sketch, Figma, etc. They are great for ideas for web components/UI
| Website | Description |
|---|---|
| UI Design Daily | Awesome UI Components of all types |
| 100 Daily UI | Free Figma library of products, elements, and screens |
| Sketch App Sources | Sketch UIs, wireframes, icons and much more |
| Humaaans | Cool illustrations of people with the ability to mix and match |
| Paaatterns | Free collection of beautiful patterns for all vector formats |
| thepatternlibrary | Free beautiful background patterns |
| Drawkit.io | Illustrations for designers and startups |
| Undraw.co | Illustrations for any idea you can imagine and create |
| Illustration.co | Open-source illustrations kit |
| Opendoodles | Free sketchy illustrations |
| Open Peeps | Hand drawn illustration library |
| UI Space | Thousands of great UI freebies |
| Animations.co | Beautiful, customizable animated GIF icons |
| Uplabs | High-quality design resources (Free & Premium) |
| InvisionApp | Library of free, high-quality UI kits, icon packs, and mockups |
| Speckyboy Article | The 10 most popular open source frontend web UI kits |
| Open Doodles | A Free Set of Sketchy Illustrations |
| Avataaars | Free sketch library of avatars illustrations by Pablo Stanley |
List of 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 | It 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 |
| Fontjoy | Generate font pairing in one click |
| Golden Ratio | Golden Ratio Typography Calculator |
| FontSpark | Discover Better Fonts |
| FontPair | Helps you pair Google Fonts together |
| Free Stock Music | Royalty-free stock music for YouTube videos, podcasts, etc |
| Abstract Fonts | Fonts free for personal and commercial use |
| Free Typography | A list of high quality fonts |
| Leon Sans | A geometric sans-serif typeface made with code |
| Lexend | Variable font empirically shown to significantly improve reading-proficiency |
| Fonts for Apple Platforms | Get the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps |
| SFWin | San Francisco Fonts for Windows 10 and non-Apple Platform |
| Font Flipper | Preview 800+ Google Fonts on top of your own designs, without having to download the fonts |
Websites and resources that help with choices related to colors
| Website | Description |
|---|---|
| Coolors | Color schemes generator |
| Coolors | Trending color palettes |
| Colors & Fonts | A curated library of colors, fonts and resources |
| Material Palette | Free to pick palettes, icons and colors for Material Design |
| ColorSpace | Generate nice color palettes from one color |
| FlatUIColors | Beautiful set of color palettes in various flavours |
| Adobe Color | Create color palettes, extract gradients from images, etc |
| Colorsinspo | All-in-one resource for finding everything about colors |
| Happyhues | Happy Hues is a color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects by Mackenzie Child |
| Adobe Trends | Discover current color trends in different industries from the creative communities on Behance and Adobe Stock |
| Color Hunt | A free and open platform for color inspiration with thousands of trendy hand-picked color palettes |
| Gradient Hunt | A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients |
| Web Gradients | Free website to find good css gradients |
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 |
| Tabler Icons | 470+ highly customizable open source SVG icons |
| Simple Icons | 1307 Free SVG icons for popular brands |
| IonIcons | Beautifully crafted open source icons from Ionic team |
| 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 |
| Fontisto Icons | Fontisto the iconic font and css toolkit · 616+ free icons |
| The Noun Project | Over 2 Million curated icons, created by a global community |
| Iconsout | Free Download Icons illustrations stock photos at one place |
| Boxicons | Boxicons is a free collection of carefully crafted open source icons |
| Nucleo App | Nucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid) |
| Icon-icons.com | Free Icons PNG, ICO, ICNS and Vector file SVG |
| Bootstrap Icons | Free Icons built for Bootstrap but they’ll work in any project |
| Remix Icon | Simply Delightful Icon System |
| Iconmonstr | Discover 4496+ free icons in 313 collections |
| Vivid.js | Ready to use Free and Open Source SVG Icons Pack JavaScript Library. |
| Iconfinder | Free and premium vector icons in SVG, PNG, CSH and AI format |
| Vivid.js | Ready to use Free and Open Source SVG Icons Pack JavaScript Library |
| Material Palette | Free to pick palettes, icons and colors for Material Design] |
| Lordicon | 50 free animated interactive icons |
| UseAnimations | Free Animated Icons in SVG and Json Format(for lottie) |
| Material Design Iconic Font | Material design icon font |
| Vscode Codicons | The icon font from Visual Studio Code |
| css.gg | 700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API |
| SVGPorn | 1000+ high-quality SVG logos |
| Payment System Logos | Logos for payment systems available in png and svg |
| Browser Logos | High resolution web browser logos |
| IconBros | 7843+ free icons grouped in 182 collections |
| LogoHub | Generate and download your logo for free in PNG and SVG format |
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 palettes. Good for product images |
| New Old Stock | Stock vintage photos |
| Pic Jumbo | Good collections of different types of photos |
| Public Domain Pictures | Public domain images of all types |
| Find A Photo | Searches multiple stock photo websites |
| Stockvault | Categorized stock photos |
| Placeholder | A free image placeholder service for the web. You can specify image size and format |
| Realistic Shots | Free high resolution stock photos |
| Negative Space | High-Resolution Free Stock Photos |
| SkitterPhoto | Free high resolution photography |
| PicoGraphy | Gorgeous, High-Resolution, Free Photos |
| Wunder Stock | Stunningly amazing free photos |
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 |
Websites that offer free stock music and/or sound effects
| Website | Description |
|---|---|
| Free Stock Music | Royalty free stock music for YouTube videos, podcasts, etc |
| Bensound | Download Royalty Free Music for free and use it in your project |
| Mixkit | Free music for your projects |
| Freesound | Free stock music and sounds |
| Free Stock Music | Royalty free stock music for YouTube videos, podcasts, etc |
| Free Music Archive | Collaborative database of creative-commons licensed sound for musicians and sound lovers |
| Musopen | An online copyright free classical music library |
Free vectors, clipart, illustrations, patterns and more
| Website | Description |
|---|---|
| Vecteezy | Find and download free vector art |
| Freepik | Free vectors, stock photos, PSD and icons |
| Free Vectors | Community of vector lovers who share free vector graphics |
| PNGTree | png, backgrounds, templates, text effects |
| Vector4Free | Free vector graphics |
| Retro Vectors | Vintage vectors and graphics |
| Freeble | Vectors, patterns, mockups and more |
| Lukaszadam | Free Vector atrworks |
| Illlustrations | Beautiful 100 Illustrations – png, svg |
| Clipart | Choose great clipart, png, coloring pages, drawings and more for your projects from the free collection! |
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 World | The biggest source of free photo-realistic Mockups online |
| Collab Shot | Real-time screen grabs and image sharing |
| Facebook Devices | Images and Sketch files of popular devices |
| Threed.io | Generate 3D mockups right in your browser. |
Websites that offer free beautiful website templates and themes of all types
| Website | Description |
|---|---|
| HTML5Up | Very modern, unique responsive HTML5/CSS3 themes |
| Templatemo | Minimal, resume, gallery themes and more |
| Templated.co | Tons of minimalistic HTML5/CSS3 themes |
| FreeHTML5 | Free & premium HTML5 and Bootstrap themes |
| StyleShout | Brilliantly crafted free website templates |
| Start Bootstrap | Bootstrap starter themes |
| Zerotheme | HTML5, Bootstrap, Prestashop templates |
| HTML5xCSS3 | Collection of wonderful templates in different categories |
| Colorlib | Almost any category of theme you can think of |
| Free CSS | Huge collection of free templates |
| Hubspot | Templates, infographics, banners and much more |
| Mobirise | Great looking HTML5/CSS3 templates |
| Bootswatch | Free themes for Bootstrap |
| Onepagelove | One page websites, templates and resources |
| Themes For App | Free Bootstrap themes and landing pages |
| BootstrapTaste | Premium & Free Bootstrap Templates |
| BootstrapMade | Elegant, clean and beautiful free templates using Bootstrap. |
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 |
| Picnic CSS | Lightweight and beautiful library |
| Wing | A beautiful CSS framework designed for minimalists |
| Chota | A micro (~3kb) CSS framework |
| Blueprint CSS | Lightweight layout library for building great responsive mobile first UIs that work everywhere |
| W3.CSS | A modern CSS framework with support for desktop, tablet, and mobile design by default. Designed to be independent of jQuery or any other JavaScript library |
| 98.css | A design system for building faithful recreations of old UIs |
| NES CSS | NES-style CSS Framework |
| Shoelace.css | Lightweight, forward-thinking CSS library built with future CSS syntax |
| MVP.css | A minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you’re done |
CSS animations to build awesome animations for websites and applications
| Website | Description |
|---|---|
| Animate.css | Just-add-water CSS animations |
| Bounce.js | Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations |
| Anime.js | Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes and JavaScript Objects |
| Magic Animations | Animations has been one of the most impressive animation libraries available |
| Zdog | Round, flat, designer-friendly pseudo-3D engine for canvas & SVG |
| CSShake | CSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web page |
| Hover.css | Hover.css is a CSS animation library designed for use with buttons and other UI elements in your website |
| AniJS | AniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structure |
| Animista | CSS Animations On Demand |
| Tachyons-animate | Tachyons itself is an atomic CSS library with a ton of utility classes for essentially designing anything by adding classes to what you need |
| Sequence.js | Sequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications |
| Infinite | These animations, like rotations and pulses, that are specifically designed to run and repeat forever |
| OBNOXIOUS.CSS | Animations for the strong of heart, and weak of mind |
| MOTION UI | A Sass library for creating flexible CSS transitions and animations |
| Greensock | A JavaScript library for building high-performance animations that work in every major browser |
| lax.js | Simple & light weight vanilla javascript plugin to create smooth & beautiful animations when you scroll! |
| Rellax.js | A buttery smooth, super lightweight, vanilla javascript parallax library |
Not quite “frameworks”, but tools for creating user interfaces with components 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 |
| Brumm Shadow Maker | An online tool to make css shadows |
| SpinKit | Simple CSS Spinners |
| Moving Letters | Animated Text with JavaScript and anime.js |
| tailwindcomponents | A free repository for community components using TailwindCSS |
| Codyhouse | Kick-start your web projects with CodyHouse’s front-end framework and library of accessible HTML, CSS, JavaScript components |
| Tailwind Starter Kit | It a beautiful extension for TailwindCSS, Free and Open Source |
| Tailwindtoolbox | Open source starter templates and components, a plugins directory and useful tools/utilities to kick start your Tailwind CSS project. |
| CSS Layout | A collection of popular web layouts and patterns in pure CSS |
UI and component libraries for the React JavaScript framework
| Website | Description |
|---|---|
| Material UI | React components for faster and easier web development, based on Material Design |
| Chakra UI | Build accessible React apps & websites with speed. Openchakra |
| React Bootstrap | Bootstrap rebuilt for React. Include Bootstrap components right in your JavaScript |
| BlueprintJS |
React-based UI toolkit for the web |
| React Admin | A frontend Framework for building admin applications. Supports API’s out of the box |
| Rebass |
React primitive UI components built with styled system |
| 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 |
| Ant Design | Open source design React ui library |
| KendoReact | UI for React Developers |
| PRIMEREACT | The ultimate collection of design-agnostic, flexible and accessible React UI Components |
| Elemental UI | A UI Toolkit for React.js Websites and Apps |
| Ant Design | Open source design React ui library. |
| KendoReact | UI for React Developers. |
| PRIMEREACT | The ultimate collection of design-agnostic, flexible and accessible React UI Components |
| Primer Components | Primer Components are React components which implement GitHub’s Primer Design System |
| Orbit | Design system and React UI components for travel projects. |
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 |
| Onsen Vue | Distributes Components for hybrid mobile apps with Vue and Onsen UI |
| Vuejsexamples | A nice collection of useful vuejs UI components |
| Inkline | Inkline is a modern UI/UX Framework for Vue.js designed for creating flawless responsive web applications |
| Vuesax | Unique and reusable UI components |
UI and component libraries for the Angular JavaScript framework
| Website | Description |
|---|---|
| Material Angular | UI library for Angular based on Material design |
| NG Bootstrap | UI library for Angular based on the Bootstrap framework |
| PrimeNG | Powerful UI component library for Angular |
| Onsen Angular | Hybrid mobile and PWA UI library for Angular and Onsen UI |
| NG Lightning | Native Angular components & directives for Lightning Design System |
| NG Semantic | UI library for Angular based on Semantic UI |
| Nebular | Customizable UI Kit, Auth & Security for Angular |
| Alyle UI | Minimal components set for Angular |
| NGX Bootstrap | Another UI library for Angular based on the Bootstrap framework |
| NG Zorro | UI library for Angular based on Ant Design |
UI and component libraries for the Svelte Javascript compiler
| Website | Description |
|---|---|
| Svelte Material UI | UI library for Svelte based on Material Design |
| SvelteStrap | UI library for Svelte based on the Bootstrap framework |
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 |
| Polaris | Design system that creates great experiences for all of Shopify’s merchants |
| Mozilla Protocol | Protocol is a design system for Mozilla and Firefox websites |
| SendGrid Style Guide | UI library for developing consistent UI/UX at SendGrid |
| VTEX Styleguide | Reusable patterns, components and assets related to product design in VTEX |
| Rizzo | Style guide with UI components, JS components, widgets, etc |
| Atomize | UI framework that helps developers collaborate with designers and build consistent user interfaces effortlessly |
| StyleGuides.io | A directory of 500+ styleguides |
All kinds of online tools for design, from photo editors to wireframing, and more
| Website | Description |
|---|---|
| Figma | Online graphic design tool (Free & paid options) |
| Vectr | Free vector graphics software |
| Canva | Create beautiful designs (Free & Paid) |
| Wireframe.cc | Wireframing tool (free & paid) |
| Fotor | Photo editor and design maker |
| Pixlr | Online photo editor |
| Animoto Video Maker | Make videos online |
| RemoveBG | Remove image backgrounds |
| Photo Creator | Create your own photos instead of searching for stock |
| Visme | Make presentations, infographics and more |
| Infogram | Create infograms |
| ChartGo | Create charts and graphs online |
| Cartoon Photo | Turn photos into cartoons |
| 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 |
| RealFaviconGenerator | Generate icons for all platforms (Windows, iOS, Android) |
| FontIcon | Create favicons and images from Font Awesome icons |
| CTA Button Maker | Create call to action buttons |
| Blobmaker | Blobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes. |
| Personas | A playful avatar generator for the modern age. |
| SoftUI | A Soft UI (neumorphism) CSS generator. |
| Photopea | Online Photoshop editor. |
| Excalidraw | Virtual whiteboard for sketching hand-drawn like diagrams. |
| Diagrams | Diagram software and Flowchart maker. |
| MapInSeconds | Simple way to visualize your data with a map. |
| Grid Malven | A css grid cheatsheet to reference when creating a css grid. |
| Blobmaker | Blobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes |
| Personas | A playful avatar generator for the modern age |
| Grid Malven | A css grid cheatsheet to reference when creating a css grid |
| Smart Upscaler | Upscale images by 2-4x resolution |
| GetAvataaars | Fun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch library |
Free software for UI, photo, 3d modeling, etc. Alternatives to paid software like Photoshop
| Website | Description |
|---|---|
| Gimp | Open source image editor similar to Photoshop |
| Gravit Designer | Free full-featured vector graphic design app that works on ALL platforms |
| Blender | Open source, free animation, 3D modeling, etc. |
| Raw Therapee | Cross-platform raw image processing program |
| Be Funky | Online design program |
| Krita | Sketching and painting program designed for digital artists |
| Pencil Project | GUI prototyping software |
| Inkscape | Powerful free design tool |
| Adobe XD | Free design tool from Adobe |
| Shapes.so | Icons that can be used as code in your projects |
| Lunacy | Sketch for Windows |
| InVision Studio | Free screen designing tool from InVision |
Here are some websites to get inspiration for design and UI
| Website | Description |
|---|---|
| Behance | Design projects featured by different creators |
| Dribbble | 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 |
| Land Book | Displays a large collection of websites to help find inspiration |
| Frontend Mentor | Real-world UI Challenges using HTML, CSS and Javascript |
| Awwwards | A website that rate and collects the best websites in the world in UI |
| Codrops | A website that collects the best UI ideas and patterns and make tutorials of it |
| SaaS Landing Page | Discover the best landing page examples created by top-class SaaS companies |
| Pages.xyz | Curate and discover the best designed web pages |
| UI Movement | UI Movement is a community of design enthusiasts who share and discuss the most interesting and unique UI designs |
Thank you for your interest on . Please fill out the form below and send it to us.