200+ Design & UI Resources For Developers

  • Leechers leech but please contribute to community we need your support:)

Ruchika oberoi

Administrator
Staff member
Mar 27, 2022
4,040
202
63
Headerimage 54

Please read before submitting new resources.​

Table of Contents​

UI Graphics​

Websites and resources with modern UI components in different formats such as PSD, Sketch, Figma, etc. They are great for ideas for web components/UI
WebsiteDescription
Awesome UI Components of all types
Free Figma library of products, elements, and screens
Sketch UIs, wireframes, icons and much more
Cool illustrations of people with the ability to mix and match
Free collection of beautiful patterns for all vector formats
Free beautiful background patterns
free illustrations for 404 pages
Illustrations for designers and startups
Open-source illustrations for any idea you can imagine and create
Open-source illustrations kit
Monochromatic, Isometric high quality illustrations
Hand drawn illustration library
Thousands of great UI freebies
Beautiful, customizable animated GIF icons
High-quality design resources (Free & Premium)
Library of free, high-quality UI kits, icon packs, and mockups
A Free Set of Sketchy Illustrations
Free sketch library of avatars illustrations by Pablo Stanley
Free Sketch designs, wireframes, illustrations, and more.
Free customizable illustrations with Figma Plugin
A collection of repeatable SVG background patterns
An open-source gradient illustrations collection by creative tim.
Subset of Storytale free quality illustrations
Free vector illustrations to class up your project
Seamless Pattern Maker
Free Background Images for awesome landing Pages
Free Animated Illustrations


Fonts​

Websites that offer free fonts as well as font based tools
WebsiteDescription
Library of around 1000 free licensed font families
Archive of freely downloadable fonts
Personal selection of beautiful, classy, punk, professional, incomplete, weird typefaces
I think the name speaks for itself Smirk
Font Squirrel scours the internet for high quality, legitimately free fonts
A digital type foundry crafting retail fonts and custom typography for various brands
Tool for finding the fonts of a website without having to search in the devtools
A type diff tool that visually contrasts the differences between two fonts
Learn about typography practices
Generate font pairing in one click
Golden Ratio Typography Calculator
Discover Better Fonts
Helps you pair Google Fonts together
A designer-centered free font website that has quick customizable previews
Fonts free for personal and commercial use
A list of high quality fonts
A geometric sans-serif typeface made with code
A variable font empirically shown to significantly improve reading-proficiency
Get the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps
San Francisco Fonts for Windows 10 and non-Apple Platform
Preview 800+ Google Fonts on top of your own designs, without having to download the fonts
Free curated fonts
High quality fonts for free
Arabic fonts for free
Simple and easy way to view the contents of font files
FREE platform for curated open-source typefaces
Upload your own SVGS and turn them into font files. Usefull if you want a smaller library loaded


Colors​

Websites and resources that help with choices related to colors
WebsiteDescription
Color palette generator
Color palette generator that uses curves to generate color palettes
Create the perfect palette or get inspired by thousands of beautiful color schemes
Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names
A curated library of colors, fonts and resources
Pick 2 colors you like and the tool generates thousands of palettes for you.
Official Google Material Color Palette Tool
Free to pick palettes, icons and colors for Material Design
Generate nice color palettes from one color
Beautiful set of color palettes in various flavours
Create color palettes, extract gradients from images, etc
All-in-one resource for finding everything about colors
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
Discover current color trends in different industries from the creative communities on Behance and Adobe Stock
A free and open platform for color inspiration with thousands of trendy hand-picked color palettes
A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
A free website to find good css gradients
A free website to produce color set
A free website to make custome gradient and some examples of gradient
A pure css and jpg gradients
UI gradients color generator
Generate new color palette with every spacebar press
1000+ Material Design palettes
Gradient Selector
Quickly generate shades of any color
The biggest collection of official brand color codes
Logo Color Codes and Palettes
Generate theme and color palette Material Design-like
Color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.
A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.
A tool that shows the midpoint colors between two colors
Ready to use copy/paste gradient buttons
Khroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.
A tool that brings attention and understanding to how color contrast can affect different people with visual impairments.
Color combination contrast tester
Tool to get hex code along with name of the color.
The stunning color scheme for website & App Designs with previews
is a designer color tool designed for creating color combinations that work together well.
A powerful online photoShop-like CSS gradient editor
Image color picker and palette generator
Color mixing tool
it will show the color schemes which are popular in outside world
Free online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc.
It gets HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names.
A free tool that shows different gradient examples in CSS and PNG format


Icons​

Resources for Icons including png, svg and more
WebsiteDescription
Well Optimized, Free icons for commercial use
8000+ free icons
Beautiful, customizable open source icons
470+ highly customizable open source SVG icons
1307 Free SVG icons for popular brands
thousands of free brands logos ( SVG - PNG )
1000+ Ultra crisp vector icons
411 carefully crafted premium pictograms by Daniel Bruce
Free icons, photos, vectors and tools
The largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
Over 2 Million curated icons, created by a global community
Free Download Icons illustrations stock photos at one place
Nucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid)
Free Icons PNG, ICO, ICNS and Vector file SVG
Free Icons built for Bootstrap but they’ll work in any project
Simply Delightful Icon System
Discover 4496+ free icons in 313 collections
Ready to use Free and Open Source SVG Icons Pack JavaScript Library.
Free and premium vector icons in SVG, PNG, CSH and AI format
50 free animated interactive icons
Free Animated Icons in SVG and Json Format(for lottie)
700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API
1000+ high-quality SVG logos
Logos for payment systems available in png and svg
High resolution web browser logos
7843+ free icons grouped in 182 collections
Generate and download your logo for free in PNG and SVG format
A icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
Free, open source icons from the creators of Tailwind CSS.
A set of free premium SVG icons for you to use on your digital products.
A website offering a number of free icons. Icons are tagged and also compressed into kits.
Browse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.
Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.
A set of free premium SVG icons for you to use on your digital products. you can download the icons into your desktop
411 carefully crafted premium pictograms
A set of 430 crypto and fiat currency icons. Completely free.
Fully customisable & accessible vector icons
Quickly generate app icons in diffrent sizes for your IOS, macOS and Android projects
2000+ Essential Line Icons for Designers and Developers
Evericons is a big pack of over 460 free icons designed by Aleksey Popov.
Download free SVG Vectors for commercial use.
Convert PNG files to SVG online & free. (One of the services provided by it.)
Icon set made with pure css code, no dependencies, “grab and go” icons
Thousands of icons, one unified framework. One library, over 40,000 vector icons.


Favicons​

Resources for Favicons
WebsiteDescription
Generate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
Generate favicon ico files for your website
Generate icons for all platforms (Windows, iOS, Android)
Generate favicons and images from Font Awesome icons


Icon Fonts​

Resources for Icon Fonts
WebsiteDescription
The web’s most popular icon set and toolkit
Swap in replacement of Font Awesome with modern line icons
Material design icon library
Beautifully crafted open source icons from Ionic team
Customizable Foundation icons
Fontisto the iconic font and css toolkit · 616+ free icons
Boxicons is a free collection of carefully crafted open source icons
2100+ free icons to spice up your creative designs
Free to pick palettes, icons and colors for Material Design]
Material design icon font
The icon font from Visual Studio Code
Devicon is a set of icons representing programming languages, designing & development tools
A sleek webfont for payment operators and methods. Featuring 116 icons
Weather Icons is the only icon font with 222 weather themed icons
202 thin stroke icons inspired by iOS 7
890+ handcrafted icons to make your web app awesome
Create your custom icon fonts in seconds. Over 9,000 icons available to pick from or upload your custom svg
200+ web icons where you can customize the names or codes of icons.
Linea: Featuring 750+ Free Icons


Stock Photos​

Websites that offer free stock photos of all kinds for your websites and apps
WebsiteDescription
Free stock photos shared by talented creators
The internet’s source of freely usable images
Over 1.7 million+ high quality stock images and videos
Gallery & free high res photo everyday
Royalty free images, stock photos, illustrations, and vectors
Free stock photos collections
Free collection of free high-resolution pictures
Free high resolution photography
Hundreds of high quality photos added weekly
Over 350,000 free stock photos for commercial use
Stock photography and color palettes. Good for product images
Stock vintage photos
Good collections of different types of photos
Public domain images of all types
Searches multiple stock photo websites
Categorized stock photos
A free image placeholder service for the web. You can specify image size and format
Free high resolution stock photos
High-Resolution Free Stock Photos
Free high resolution photography
Gorgeous, High-Resolution, Free Photos
Stunningly amazing free photos
Free Images & Free stock photos - PxHere
Royalty Free Stock Photos
Food photo stock
A website offering Beautiful, high-res photos of black and brown people.
Unique AI Generated model photos
Uniquely free photos. Handpicked, non-stocky images.
Find and download free stock photos - all free for personal and commercial use
An easy to use API to get beautiful placeholder images. Size and other parameters can be specified.
An image library specializing in science and nature images
Free images to provide scientists, resource managers, government agencies, community groups and graphics professionals with a resource for enhancing science communication.
Free nature images


Stock Videos​

Websites that offer free stock videos of all kinds for your websites and apps
WebsiteDescription
Largest library of free to use videos, donated by the community
Large library of free to use videos, donated by the community similar to Pexels
Beautiful free stock video footage
Free HD stock footage & 4K videos
Stock video clips & music
Free video clips and loops
Free and premium stock videos
Free To Use Cinemagraphs Created With VIMAGE App


Stock Music & Sound Effects​

Websites that offer free stock music and/or sound effects
WebsiteDescription
Royalty free stock music for YouTube videos, podcasts, etc
Download Royalty Free Music for free and use it in your project
Free music for your projects
Free stock music and sounds
Collaborative database of creative-commons licensed sound for musicians and sound lovers
An online copyright free classical music library
Free Premium Music for Your Projects Gift Royalty Free. Cleared for YouTube.


Vectors & Clip Art​

Free vectors, clipart, illustrations, patterns and more
WebsiteDescription
Find and download free vector art
Free vectors, stock photos, PSD and icons
Community of vector lovers who share free vector graphics
png, backgrounds, templates, text effects
Free vector graphics
Vintage vectors and graphics
Vectors, patterns, mockups and more
Free Vector atrworks
Beautiful 100 Illustrations - png, svg
Choose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
A set of 8 simple, black & white, stylish illustrations
Download vector logos of brands you love
Generate low-poly backgrounds, textures, and vectors
Generate Blob shapes for Web and Flutter apps
A community for designers to share & download transparent background PNG cliparts
A collection of free and customizable illustrations for projects
Beautiful illustrations of black people (free and premium)
A collection of free illustrations and more
Free tool to make it easier for designers and developers to export a beautiful SVG shape divider
3000 free medical images to illustrate your publications and Powerpoint presentations
Free clip art you can use for anything you like


Product & Image Mockups​

Create mockups of devices and other products
WebsiteDescription
Create stunning product mockups (free & premium)
Create beautiful device mockup images for your app or website design
Instantly turn your screenshot into a mockup
Create beautiful browser & mobile mockups in seconds
Create a mockup from a URL
The biggest source of free photo-realistic Mockups online
Real-time screen grabs and image sharing
Images and Sketch files of popular devices
Generate 3D mockups right in your browser.
100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TV
Create high-resolution device mockups for social media, for free


HTML & CSS Templates​

Websites that offer free beautiful website templates and themes of all types
WebsiteDescription
Very modern, unique responsive HTML5/CSS3 themes
Minimal, resume, gallery themes and more
Tons of minimalistic HTML5/CSS3 themes
Free & premium HTML5 and Bootstrap themes
Brilliantly crafted free website templates
Bootstrap starter themes
HTML5, Bootstrap, Prestashop templates
Collection of wonderful templates in different categories
Almost any category of theme you can think of
Huge collection of free templates
Templates, infographics, banners and much more
Great looking HTML5/CSS3 templates
Free themes for Bootstrap
One page websites, templates and resources
Free Bootstrap themes and landing pages
Premium & Free Bootstrap Templates
Elegant, clean and beautiful free templates using Bootstrap.
W3Layouts: 3784+ Free Website Templates for 2020
Tooplate: Free HTML Templates for everyone!
Fully coded HTML templates to help you easily build your startup landing page without hassles.
Get High Converting Landing Pages For Free!
Free Landing Page Templates and Bootstrap Themes
Free web templates to kickstart your idea!


CSS Frameworks​

CSS/UI frameworks to help build great looking websites and applications
WebsiteDescription
Low level, utility-first framework
Popular UI framework with tons of components that use both CSS and JS
A modern responsive front-end framework based on Material Design
Light framework based on Material Design. No JS dependency
Modern CSS framework with no JS
Extremely light framework for basic UI elements
Empowers designers and developers by creating a shared vocabulary for UI
A community fork of Semantic-UI
Mobile first framework with clean markup
A set of small, responsive CSS modules
Lightweight and modular front-end framework
Lightweight, grid-layout engine for Sass
Minimalist CSS framework
Simple, extensible CSS framework written in Sass
Lightweight, modern CSS framework
Lightweight and beautiful library
A beautiful CSS framework designed for minimalists
A micro (~3kb) CSS framework
A lightweight layout library for building great responsive mobile first UIs that work everywhere
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
A design system for building faithful recreations of old UIs
NES-style CSS Framework
Lightweight, forward-thinking CSS library built with future CSS syntax
A minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you’re done
Open source modular CSS toolkit providing great structure for building websites quickly
Turret CSS is a styles framework for development of responsive websites.
A strong, independent CSS Framework.
Shorthand is a free and open source css framework, that allows you to make unique and modern design without writing any css
XP.css is an extention of 98.css. A CSS library for building interfaces that look like old UIs.
Framework7 - is a free and open source framework to develop mobile, desktop or web apps with native look and feel.
A pure CSS tooltip library for your lovely websites.
Pure CSS Image Hover Effect Library
minimal, responsive, style-agnostic CSS framework
Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible.
Material Design with Bootstrap
A modern CSS framework for developing powerful web interfaces faster and easier
A responsive and lightweight framework, designed for quickly building beautiful dashboards and product pages.


CSS Animations​

CSS animations to build awesome animations for websites and applications
WebsiteDescription
Just-add-water CSS animations
Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations
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
Animations has been one of the most impressive animation libraries available
Round, flat, designer-friendly pseudo-3D engine for canvas & SVG
CSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web page
Hover.css is a CSS animation library designed for use with buttons and other UI elements in your website
AniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structure
CSS Animations On Demand
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 is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications
These animations, like rotations and pulses, that are specifically designed to run and repeat forever
Animations for the strong of heart, and weak of mind
A Sass library for creating flexible CSS transitions and animations
A graphical user interface for generating custom CSS keyframe animations


Javascript Animation Libraries​

javascript animations libraries to build awesome animations for websites and applications
WebsiteDescription
A JavaScript library for building high-performance animations that work in every major browser
Velocity is an lightweight animation engine with the same API as jQuery’s $.animate()
Simple & light weight vanilla javascript plugin to create smooth & beautiful animations when you scroll!
A buttery smooth, super lightweight, vanilla javascript parallax library
An easy to use, lightweight, 3D library with a default WebGL renderer.
Reveal Animations When You Scroll.
Free lightbox plugin.
Animate on scroll library to reveal animations when You scroll.
A tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery.
Rough Notation is a small JavaScript library to create and animate annotations on a web page
A lightweight library for creating particles, an improved version of the abandoned and obsolete particles.js
A lightweight JavaScript library for creating particles
The motion graphics toolbelt for the web


UI Components & Kits​

Not quite “frameworks”, but tools for creating user interfaces with components or UI kits
WebsiteDescription
Useful Bootstrap 4, HTML5, CSS3 Code Snippets to Build Web Layouts
A minimal, ui-focused programming language for web designers
Calendars, price grids and other UI components
Over 170 responsive design blocks ready to be used in your web or mobile apps
Open source toolkit for building material design with Bootstrap
Desktop UI library for Electron
Minimal free user interface kit
A free and modern UI toolkit for web makers based on Bootstrap
All types of UI libraries and kits including JS frameworks like React
An online tool to make css shadows
Best open source admin dashboard & control panel theme
Simple CSS Spinners
CSS spinners collection with Vue.js integration.
Online service provider for creating simple animations, spinners, progress bar and more
Animated Text with JavaScript and anime.js
A collection of popular web layouts and patterns in pure CSS
Kick-start your web projects with CodyHouse’s front-end framework and library of accessible HTML, CSS, JavaScript components
Tailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open Source
Open source starter templates and components, a plugins directory and useful tools/utilities to kick start your Tailwind CSS project.
A free repository for community components using TailwindCSS
SweetAlert makes popup messages easy and pretty.
A beautiful,responsive,customizable,accessible replacement for javascript’s popup boxes
Open source ready-to-use Tailwind CSS components.
A set of framework-agnostic web components based on neumorphic design.
An interface system that can be used with modern Web Frameworks such as React, Vue and Angular.


React UI​

UI and component libraries for the React JavaScript framework
WebsiteDescription
React components for faster and easier web development, based on Material Design
Build accessible React apps & websites with speed.
Bootstrap rebuilt for React. Include Bootstrap components right in your JavaScript
The documented collection of UI components
Another Bootstrap UI library for React
A frontend Framework for building admin applications. Supports API’s out of the box
React-based UI toolkit for the web
UI components based off of the Semantic UI framework
React UI kit featuring a modern design system with dozens of custom components
UI set for data. Includes tables, lists, sorting, etc.
Material design UI library for React
Distributes UI React components and static assets for use in building web layouts
Desktop styled components in React. Includes MacOS and Windows based components
Build consistent, themeable React apps based on constraint-based design principles
Distributes Components for hybrid mobile apps with React and Onsen UI
Design system for React
React primitive UI components built with styled system
mobile first UI component library
React design kit, library and guides
Open source landing page template for react
A UI Toolkit for React.js Websites and Apps
Open source design React ui library.
Bumbag is a friendly React UI Kit suitable for MVPs or large-scale applications.
The ultimate collection of design-agnostic, flexible and accessible React UI Components
Primer Components are React components which implement GitHub’s Primer Design System
Design system and React UI components for travel projects.
Base Web provides a robust suite of components out of the box
Backpack is the Lonely Planet toolset that we use to build front end apps.
Data visualization library for React based on D3
A suite of React components, sensible UI design, and a friendly development experience.
Spring-physics based animation library for React applications.
A composable charting library built on React components.
Modern and minimalist React UI library
A React library to power production-ready animations.
A React implementation of Spectrum, Adobe’s design system.
A lightweight React component for creating particles
A React particles animation background component


Vue UI​

UI and component libraries for the Vue JavaScript framework
WebsiteDescription
Material design component framework
Use Bootstrap components with Vue
Lightweight UI components based on Bulma
Semantic UI Vue is the Vue integration for Semantic UI
High-performance Material Design component suite with builders for SPA, SSR, PWA, Mobile (Cordova & Capacitor), Desktop (Electron) and Browser extensions
Desktop UI library for Vue
Vue UI toolkit for the web
VueUI library with a simple API, inspired by Google’s Material Design
Distributes Components for hybrid mobile apps with Vue and Onsen UI
A nice collection of useful vuejs UI components
Inkline is a modern UI/UX Framework for Vue.js designed for creating flawless responsive web applications
Unique and reusable UI components
UI library for Vue based on Ant Design
A high-quality & free Vue UI kit featuring a modern design system with dozens of custom components
Powerful yet simple to use, versatile, performant Vue UI Component Library to help you build stunning user interfaces.
Chakra UI is a simple modular and accessible component library that gives you the building blocks to build Vue applications with speed.
Dozens of useful and beautiful Vue components made for people with all skill levels with extensive documentation.
A lightweight Vue component for creating particles


Angular UI​

UI and component libraries for the Angular JavaScript framework
WebsiteDescription
UI library for Angular based on Material design
UI library for Angular based on the Bootstrap framework
Powerful UI component library for Angular
Hybrid mobile and PWA UI library for Angular and Onsen UI
Native Angular components & directives for Lightning Design System
UI library for Angular based on Semantic UI
Customizable UI Kit, Auth & Security for Angular
Minimal components set for Angular
Another UI library for Angular based on the Bootstrap framework
UI library for Angular based on Ant Design
npm library for pagination
for multi select dropdowm in forms
A lightweight Angular component for creating particles


Svelte UI​

UI and component libraries for the Svelte Javascript compiler
WebsiteDescription
UI library for Svelte based on Material Design
UI library for Svelte based on the Bootstrap framework
UI library for Svelte based on Flat Design
A lightweight Svelte component for creating particles


Design Systems & Style Guides​

Design systems, style guides, toolkits, docs. Some of these are design guides for top companies/websites
WebsiteDescription
Google’s Material Design
Design system for enterprise-level products
Guides and templates for using Apple design and UI
Design, build, and create with GitHub’s design system
Oracle’s design system and toolkit
Design system, guides and React component library
Robust Twig and web component powered UI components
UX guidelines, HTML/CSS framework, and Angular components
Atlassian’s official UI library, built according to the Atlassian Design Guidelines
Audi UI design system and toolkit
Carbon is IBM’s open-source design system for products and experiences
Yelp style guide, components and toolkit
Scalable design system of visual language, components, and design assets
Guides and toolkits that blend finance with simplicity and ease of use
Open source and community driven project for consistent user interfaces
Guidelines and resources to create meaningful experiences for Infor’s products
An experience language for crafting beautiful UI
Style guide and components from Mailchimp
Set of design principles and components
Collection of UX frameworks from Microsoft
Design guide with components for designing with Pluralsight
Design system that creates great experiences for all of Shopify’s merchants
Protocol is a design system for Mozilla and Firefox websites
UI library for developing consistent UI/UX at SendGrid
Reusable patterns, components and assets related to product design in VTEX
Style guide with UI components, JS components, widgets, etc
UI framework that helps developers collaborate with designers and build consistent user interfaces effortlessly
A directory of 500+ styleguides
Open source design system, guides & components
Design guideline for developing applications under the Skoda brand
Adobe’s design system that provides components and tools to help product teams work more efficiently, and to make Adobe’s applications more cohesive.
Gojek’s design language system. A collection of guidelines and components to create amazing user experiences.
A collection of the key maxims that designers must consider when building user interfaces.


Online Design Tools​

All kinds of online tools for design, from photo editors to wireframing, and more
WebsiteDescription
Online graphic design tool (Free & paid options)
Free vector graphics software
Create social media banner designs in minutes from hundreds of customizable templates
Create beautiful designs (Free & Paid)
A free SVG wave generator to make unique SVG waves for web design
Easy CSS clip-path maker
Eight values specifying border-radius in CSS ( border-radius generator )
Wireframing tool (free & paid)
Photo editor and design maker
Online photo editor
Make videos online
Remove image backgrounds
Create your own photos instead of searching for stock
Create presentations, infographics and more
Create infograms
Create charts and graphs online
Turn photos into cartoons
Create custom logos
Wireframes, diagrams and more (4 free)
Online drawing tool
Sitemap builder
Create call to action buttons
Blobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes
A playful avatar generator for the modern age
A Soft UI (neumorphism) CSS generator
A Online Photoshop editor
Virtual whiteboard for sketching hand-drawn like diagrams
Diagram software and Flowchart maker
Simple way to visualize your data with a map
A css grid cheatsheet to reference when creating a css grid
A flexbox grid cheatsheet to reference when working with flexbox
Upscale images by 2-4x resolution
Fun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch library
Easily generate avatars for your projects with Big Heads by Robert Broersma.
Break the code barrier, Build better business websites, faster. Without coding.
Instantly remove the background from your photos
Generate Soft-UI CSS shadow code
Design your database for free online
Create full-fledged web apps visually
Turn real code into faux code
Real-time interactive design tool that allows you to design, animate, and immediately integrate your assets into any platform.
Remove Video Background 100% Automatically and Free
Convert your source code into nice pictures for your articles, tweets, messages, posts…
Create a Website You’re Proud Of
Website Speed and Performance Optimization
Is prototyping tool for teams
Free online diagram editor tool


Downloadable Design Software​

Free software for UI, photo, 3d modeling, etc. Alternatives to paid software like Photoshop
WebsiteDescription
Free & open source image editor similar to Photoshop
Free full-featured vector graphic design app that works on ALL platforms
Open source, free animation, 3D modeling, etc.
Cross-platform raw image processing program
Online design program
Sketching and painting program designed for digital artists
GUI prototyping software
Powerful free design tool
Free design tool from Adobe
Icons that can be used as code in your projects
Sketch for Windows
Free screen designing tool from InVision
Free & Open source photography workflow application and raw developer
Free Photo Editor: For windows only
Open Source colors software: Retrieve, manipulate and store your colors easely!


Design Inspiration​

Here are some websites to get inspiration for design and UI
WebsiteDescription
Design projects featured by different creators
Design projects featured by different creators
Showcases websites made by people from all over the world
Curated collection of UX writing examples, microcopy examples and copywriting examples
Latest design work from designers and the design community
Free online resource library for product designers
Displays a large collection of websites to help find inspiration
Real-world UI Challenges using HTML, CSS and Javascript
A website that rate and collects the best websites in the world in UI
A website that collects the best UI ideas and patterns and make tutorials of it
Discover the best landing page examples created by top-class SaaS companies
Curate and discover the best designed web pages
UI Movement is a community of design enthusiasts who share and discuss the most interesting and unique UI designs
Best landing page inspiration
Free front end design from css html and javascript. latest work some design part
Discover and be inspired by beautiful webapp designs
Daily inspiration collected from daily ui archive and beyond. Hand picked, and updating daily.
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.
A site offering users a ton of company e-mails from customer service to marketing.
A site offering fonts, mockups, templates graphics and ui kits.
siteInspire is a showcase of the finest web and interactive design.
A site for web design inspiration, updated daily.
Responsive navigation examples
Collection of different web Components for inspiration.
A collection of inspirational websites using media queries and responsive web design
Search engine for design inspiration
Access to 370 million pieces of art for inspiration.


Image Compression​

Websites that allow you to compress large images
WebsiteDescription
Smart PNG and JPEG compression
Online JPEG and PNG optimizer / compressor with settings and archive download
JPEG, PNG, GIF, SVG Compression
Image compression from Google Chrome Labs
Bulk image resizing, compression & converting that perform all the tasks within the browser (It works offline)
The fastest free web app for easy image modification
Online SVG optimizer with a lot of settings and possibility to cut and paste svg code directly in it.
Compress JPEG images with size even greater than 5MB
JPEG, GIF, PNG Compression
Free Image and Photo Resizer
Image Optimizer Free With Quality Options
This tool removes superfluous information, thereby reducing the size of your SVG files
Free online tool for resizing and compressing digital photos and images for displaying on the web
Resize Your Images Online
Animated GIF maker and Image editor including Image optimization and supports WebP conversion
Resize png for without losing transparent background.


Others​

Uncategorized Stuff
WebsiteDescription
Check your awesome responsive webpage looks great in every size
This is a modest collection of cheatsheets on Internet
A collection of handy, free-to-use tools for web developers, programmers and designers.
A famous blog for many amazing HTML, CSS, JQuery designs.
Free CSS tricks and some unique ideas for beginners and advanced
An interactive viewer that helps designers test material design breakpoints across desktop, mobile, and tablet
A collection of tools for developers who have little to no artistic talent
A web tool to scan websites against WCAG rules
Command line tool to formatted commit messages according to the standards
Tool For Code Foramtter, Minifier, File Converter
A collection of free single-purpose online tools for web developers
This generator will assist in creating a pure CSS corner ribbon.
Check cross-browser compatibility of frontend technologies.
Check JavaScript versions (ES5, ES6, ES2016+ etc.) compatibility across different compilers, servers/runtimes and platforms (Desktop and Mobile).
Most commonly used device resolutions including phones and tablets
Build, test and discover frontend code.
A tool for designers and frontend developers to design and debug their in all platforms with ease
Client-side HTML-to-PDF rendering using pure JS.
A collection of all css properties and definitions in detail
Generate critical css for your web pages
Browser extension to find SVGs on a webpage and download, copy to clipboard, or export as PNG.
A collection of useful snippets and code examples for HTML, CSS, JavaScript, Node, Artisan, Blade and more.
Javascript playground.
All HTML tags briefly explained.
source: