Is design-resources-for-developers free and open source?

Yes. design-resources-for-developers is open source, available under the MIT license.

Is design-resources-for-developers actively maintained?

design-resources-for-developers is actively maintained — the latest commit landed within the last month. Its health score is 100/100.

How popular is design-resources-for-developers?

design-resources-for-developers has 66.1k GitHub stars.

What are some alternatives to design-resources-for-developers?

Alternatives to design-resources-for-developers include awesome (sindresorhus), free-for-dev, public-apis, awesome-design and CSS-Tricks Almanac.

design-resources-for-developers

MIT★ 66,060

100

Health 100/100

Baseline50
Commit recency+25
Popularity+20
Open-issue load+5

A massive, community-curated awesome-list of free and freemium design assets and tools for developers — covering UI graphics, fonts, color tools, icons, stock media, CSS/JS libraries, design systems, and AI design tools. It's a categorized link directory rather than a software library.

awesome-list color-tools css design-resources developer-tools fonts icons illustrations stock-photos ui-kits

Raw .md

Embed badge

[![health](https://opensources.dev/resource/design-resources-for-developers/badge.svg)](https://opensources.dev/resource/design-resources-for-developers)

design-resources-for-developers repository preview card

MITPermissive — free to use in commercial and proprietary software, with attribution.View license →

Production readiness

4/5

Actively maintainedCommits in the last 6 months
No known vulnerabilitiesNot yet scanned
Clear, usable licenseMIT (permissive)
Proven adoptionWidely used
Has documentationDocumentation indexed

MaintenanceActively maintainedIs design-resources-for-developers still maintained? →

Our analysis

A curated markdown directory maintained by Brad Traversy that catalogs hundreds of free design resources for developers, organized into sections like UI graphics, fonts, colors, icons, CSS frameworks, illustration libraries, and AI design tools.

When to use design-resources-for-developers

Reach for it when you're a developer (not a dedicated designer) who needs quick access to free or low-cost assets — illustrations, fonts, icon sets, color palettes, mockups, or CSS/JS UI libraries — without hunting across the web. Great as a bookmark or starting point for a side project's visual layer.

When not to

It's not a code dependency or library you install — if you need an actual UI component framework, design system, or programmatic tool, go directly to the linked project (e.g. a React UI library) rather than this index. It also won't help with custom or branded design work that needs a real designer.

Strengths

Enormous breadth: 30+ categories spanning graphics, type, color, media, and code libraries
Hugely popular and trusted (66k+ stars), reflecting community vetting of the links
Well-organized table of contents with descriptions for each resource
Lowers the barrier for developers to produce decent-looking UIs without design expertise

Trade-offs

Pure link list — no code, no API, nothing to integrate
Inevitable link rot and stale entries as third-party sites change or disappear
Quality and licensing of linked resources vary; users must verify terms themselves
Contains sponsor/affiliate promotion (e.g. terminal sponsor banner) at the top
Overlaps heavily with many other 'awesome' design lists

Maturity

Mature and very widely referenced, with active contribution guidelines and ongoing community PRs. As a static curated list its 'maintenance' means keeping links fresh rather than shipping releases; long-term accuracy depends on contributors pruning dead links.

Documentation from design-resources-for-developers, shown under MIT with attribution. Source: https://github.com/bradtraversy/design-resources-for-developers

Warp, the intelligent terminal for developers Available for MacOS, Linux, & Windows

Please read `contributing guidelines` before submitting new resources.

UI Graphics
Fonts
Colors
Icons
Logos
Favicons
Icon Fonts
Stock Photos
Stock Videos
Stock Music & Sound Effects
Vectors & Clip Art
Product & Image Mockups
HTML & CSS Templates
CSS Frameworks
CSS Methodologies
CSS Animations
Javascript Animation Libraries
Javascript Chart Libraries
UI Components & Kits
React UI Libraries
Vue UI Libraries
Angular UI Libraries
Svelte UI Libraries
React Native UI Libraries
Design Systems & Style Guides
Online Design Tools
Downloadable Design Software
Design Inspiration
Image Compression
Chrome Extensions
Firefox Extensions
AI Graphic Design Tools
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

Website DescriptionSVG sine wavesExport perfect sine waves as SVG for your front-end projectsUI Design DailyAwesome UI Components of all types100 Daily UIFree Figma library of products, elements, and screensSketch App SourcesSketch UIs, wireframes, icons and much moreHumaaansCool illustrations of people with the ability to mix and matchPaaatternsFree collection of beautiful patterns for all vector formatsDrawkit.ioIllustrations for designers and startupsAbsurd.designFree surrealist illustrations for designers and developersUndraw.coOpen-source illustrations for any idea you can imagine and createManypixels.coMonochromatic, Isometric high-quality illustrationsOpen PeepsHand drawn illustration libraryInvisionAppLibrary of free, high-quality UI kits, icon packs, and mockupsOpen DoodlesA Free Set of Sketchy IllustrationsAvataaarsFree sketch library of avatars illustrations by Pablo StanleyBlushFree customizable illustrations with Figma PluginHero PatternsA collection of repeatable SVG background patternsBEAUBUS PatternsA set of 150+ free SVG patterns (backgrounds)IRA DesignAn open-source gradient illustrations collection by creative tim.Transparent TexturesA collection of transparent textures background patterns.icons8.com/illustrationsVector illustrations to class up your projectPatternicoSeamless Pattern MakerPixeltrue IllustrationsFree Animated IllustrationsAbstract User Avatar APIAPI to create simple yet flexible user avatars from user names or emailssketchvalleyDownload free PNG, SVG or AI file .PatternPadFree and unlimited unique pattern designs.DimensionsDimensions.com is an ongoing reference database of dimensioned drawings documenting the standard measurements and sizes of the everyday objects and spacesFreebiesbugHand-picked resources for web designers and developers, constantly updated.FlexipleOne new high-quality, open-source illustration each day.Cool TextCool Text is a FREE graphics generator for web pages and anywhere else you need an impressive logo without a lot of design workillustration kitPremium open source illustrations added dailyDoodad Pattern GeneratorCreate unique, seamless, royalty-free patterns.Pattern MonsterA simple online pattern generator to create repeatable SVG patternsExemplarFree Avatar Library for Figma and SketchUIBundleThousands of Free Design Resources like UI Kits, Mockups, Illustrations, Icons, Fonts, 3D assets, Templates and more.openby.designCustom crafted free UI design resources, for personal and commercial projects. No attribution is required.Design StripeCreate beautiful illustrations, no design skills needed.HOLA SVG!An SVG playground to share SVG stuff.symu.coFree templates, UI kits, icon, PSDMesh GradientGenerate & download beautiful mesh gradients.CSS Shadow GradientsGenerate CSS Gradients For Shadows.CreaticaGenerate unique beautiful and unique Backgrounds and patterns.Boring AvatarsSVG random, cutely avatars collectionsHtml to DesignConvert any website into fully editable Figma designsfffuelcollection of color tools and free SVG generators for gradients, patterns, textures, shapes & backgroundsMesherA Free tool to create beautiful mesh gradients only with CSS code. Use your own colors or randomly generated ones to build the trendiest CSS gradientsSquare Face Avatar GeneratorGenerate square-face avatars & icons online

Fonts

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

Website DescriptionGoogle FontsLibrary of around 1000 free licensed font familiesDaFontArchive of freely downloadable fontsUse & ModifyPersonal selection of beautiful, classy, punk, professional, incomplete, weird typefaces1001 Free FontsI think the name speaks for itself :smirk:Font SquirrelFont Squirrel scours the internet for high quality, legitimately free fontsFont FabricA digital type foundry crafting retail fonts and custom typography for various brandsJust Free FontsA hand-curated collection of freeware, open-source, and public domain fonts intended for commercial useTiffA type diff tool that visually contrasts the differences between two fontsTypeKit PracticeLearn about typography practicesFontjoyGenerate font pairing in one clickGolden RatioGolden Ratio Typography CalculatorFontGetHas a variety of fonts available to download and sorted neatly with tagsFontPairHelps you pair Google Fonts togetherFont SpaceA designer-centered free font website that has quick customizable previewsAbstract FontsFonts free for personal and commercial useFree TypographyA list of high quality fontsLeon SansA geometric sans-serif typeface made with codeLexendA variable font empirically shown to significantly improve reading-proficiencyFonts for Apple PlatformsGet the details, frameworks, and tools you need to use system fonts for Apple platforms in your appsSFWinSan Francisco Fonts for Windows 10 and non-Apple PlatformFont FlipperPreview 800+ Google Fonts on top of your own designs, without having to download the fontsFonts ArenaFree curated fontsBefontsHigh quality fonts for freeArabic fontsArabic fonts for freeFontDropSimple and easy way to view the contents of font filesOpen FoundryFREE platform for curated open-source typefacesGlyphterUpload your own SVGS and turn them into font files. Useful if you want a smaller library loadedGoogle Webfonts HelperA Hassle-Free Way to Self-Host Google FontsRough Font AwesomeWhen RoughJS meets Font AwesomeFFontsStylish fonts for freeMalayalam FontsMalayalam fonts for free which are maintained by Swathanthra Malayalam Computing(SMC)Dev FontsFind and use the coding fonts for freeFont MFree font you can download for material coding and designW FontsDownload Free fontsModern fluid typography editorFluid typography is a modern way of approaching responsive typography.UrbanFontsA collection of over 8000 free fonts and dingbatsTypespirationInspirational font combinations and color palettesFontsourceSelf-host Open Source fonts in neatly bundled NPM packages.FontBoltDiscover and generate your favorite fonts from pop culture.FontsWikiFree typography resource with font downloads, pairing guides, and font-in-use references for logos, films, games, and design projects.FontshareFontshare is a free fonts service from the Indian Type Foundry (ITF), making quality fonts accessible to all.Bunny FontsPrivacy-focused Google Fonts alternative, GDPR compliant with faster CDN

Colors

Websites and resources that help with choices related to colors

Website DescriptionPaletteForgeGenerate beautiful color palettes from different categories.ColorlabCreate color palette, gradients, color scales, check contrast all in one place.Color Brewer 2The original color palette generator, also supporting color blindness. Probably the scientifically best option. Also probably not the prettiest.HuetoneA tool to create accessible color systems.Colormind.ioColor palette generatorColorCurves.appColor palette generator that uses curves to generate color palettesColorGradientA free tool to create simple and complex CSS Gradients visuallyCoolorsCreate the perfect palette or get inspired by thousands of beautiful color schemesUI ColorsTailwind CSS color palette generatorHTML Color CodesGet HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color namesColors & FontsA curated library of colors, fonts and resourcesPalette ListPick 2 colors you like and the tool generates thousands of palettes for you.Google Material Color ToolOfficial Google Material Color Palette ToolMaterial PaletteFree to pick palettes, icons and colors for Material DesignColorSpaceGenerate nice color palettes from one colorFlatUIColorsBeautiful set of color palettes in various flavorsAdobe ColorCreate color palettes, extract gradients from images, etc.ColorsinspoAll-in-one resource for finding everything about colorsColorsWallPlace to store your color palettes and generate palette in one clickHappyhuesHappy 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 ChildAdobe TrendsDiscover current color trends in different industries from the creative communities on Behance and Adobe StockColor HuntA free and open platform for color inspiration with thousands of trendy hand-picked color palettesGradient HuntA free and open platform for gradient inspiration with thousands of trendy hand-picked color gradientsWeb GradientsA free website to find good CSS gradientsColorBoxA free website to produce color setCSS gradientA free website to make custom gradient and some examples of gradientgradientaA pure css and jpg gradientsUI GradientsUI gradients color generatorPalette GeneratorGenerate new color palette with every spacebar pressMaterial Palettes1000+ Material Design palettesGrabientGradient SelectorShadeSwashQuickly generate shades of any colorBrandColorsThe biggest collection of official brand color codesBRAND PALETTESLogo Color Codes and PalettesMaterial Design Palette GeneratorGenerate theme and color palette Material Design-likeColorateColor scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.0to255A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.Color BlenderA tool that shows the midpoint colors between two colorsGradient ButtonsReady to use copy/paste gradient buttonsKhromaKhroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.whocanuseA tool that brings attention and understanding to how color contrast can affect different people with visual impairments.ColorableColor combination contrast testerColor Hex PickerTool to get hex code along with name of the color.SaruwakakunThe stunning color scheme for website & App Designs with previewsPalettonPaletton.com is a designer color tool designed for creating color combinations that work together well.ColorzillaA powerful online Photoshop-like CSS gradient editorCSS Gradient EditorYou may only need this tool for creating CSS gradient backgrounds and patterns.Image Color PickerImage color picker and palette generatorCombineCOLORSColor mixing toolColor LoversIt will show the color schemes which are popular in the outside world.HTML CSS ColorFree online Color (USA) or Colour (British) tools: information, gradient generator, color wheels etc.HEX Color CodesIt gets HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names.CoolHue 2.0A free tool that shows different gradient examples in CSS and PNG formatColors.lolInteresting color palettes generated by a Twitter bot, there are hex codes and descriptive names for each color.colors.dopelySuper-fast and simple color palette generator, palettes can be saved and shared in seconds.UIColor PickerA collection of UI Colors with hex codes available to be copied in just one click.Color HexColor-hex gives information about colors including color models (RGB,HSL,HSV and CMYK) and generates a simple css code for the selected color.FarbVeloA random color palette generatorVeranda ColorBrowse color palettes made by other designers, generate and submit your ownDuoDuo is a collection of colour combinations that I’ve curated from personal projects or that I’ve come across on the web.Lospec Palette ListThe Lospec Palette List is a database of palettes for pixel art.Palettte AppBuild smooth color schemes that flow from one color to another.EggradientsGradient Background Colors with eggs.GradientosFind and test gradients easily.EncycolorpediaWebsite for referencing web colors. Color knowledge, Web colors, Hex color codes.CromaPowerful color tools including an eyedropper, color picker, and palette generator.Color DesignerA gradient generetor from one color.DuotoneFind beautiful free duotone images to use in any project, or make custom duotone images by uploading your own image and applying a duotone effect in seconds.coolbackgrounds generatorExplore a beautifully curated selection of cool backgrounds that you can add to blogs, websites.Color Shades GeneratorWe can quickly generate color shades of our favorite colors or any colors, to create templates or css components with multiple color shades and more useful tools available on same siteHuemintHuemint uses machine learning to create unique color schemes for your brand, website or graphicInclusiveColors palette creatorCreate custom accessible Tailwind-style color palettes, where you can modify HSL curves across whole swatches, check WCAG/APCA contrast, then export to Tailwind/CSS/Figma/AdobeAiSekaDiscover Created the best Color Palette & Color Tools.Volume3D OKLCH color palette generator.EnigmaEaselAI color palette generator and gradient generator for creating accessible design systems with built-in contrast auditing and Tailwind exports.

Icons

Resources for Icons including png, svg and more

Website DescriptionCircum IconsConsistant open source icons as SVG for React, Vue and SvelteUXWingWell Optimized, Free icons for commercial useShapedfonts Iconclub8000+ free iconsFeather IconsBeautiful, customizable open source iconsTabler Icons3500+ highly customizable open source SVG icons with React, Preact, Vue, Svelte and SolidJS supportXiconsSVG Vue/React components integrated from fluentui-system-icons, ionicons, etc. (Vue3, Vue2, React, SVG).IconoirFree library of 900+ open source iconsSimple Icons1307 Free SVG icons for popular brandsLinear Icons1000+ Ultra crisp vector iconsIcons8Free icons, photos, vectors and toolsFlat IconThe largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formatsThe Noun ProjectOver 2 Million curated icons, created by a global communityIconscoutFree Download Icons illustrations stock photos at one placeIconSear.chSearch engine with over 50,000 SVG icons indexedNucleo AppNucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid)Icon-icons.comFree Icons PNG, ICO, ICNS and Vector file SVGBootstrap IconsFree Icons built for Bootstrap but they'll work in any projectRemix IconSimply Delightful Icon SystemIconmonstrDiscover 4496+ free icons in 313 collectionsVivid.jsReady to use Free and Open Source SVG Icons Pack JavaScript Library.IconfinderFree and premium vector icons in SVG, PNG, CSH and AI formatLordicon50 free animated interactive iconsUseAnimationsFree Animated Icons in SVG and Json Format(for lottie)css.gg700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & APIIconBros7843+ free icons grouped in 182 collectionsMaterial Design IconsAn icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.HeroiconsFree, open source icons from the creators of Tailwind CSS.ZondiconsA set of free premium SVG icons for you to use on your digital products.Endless IconsA website offering a number of free icons. Icons are tagged and also compressed into kits.IcomoonBrowse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.Eva IconsEva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.CryptoiconsA set of 430 crypto and fiat currency icons. Completely free.IkonateFully customizable & accessible vector iconsappiconQuickly generate app icons in different sizes for your IOS, macOS and Android projectsLineIcons2000+ Essential Line Icons for Designers and DevelopersEvericonsEvericons is a big pack of over 460 free icons designed by Aleksey Popov.SVG RepoDownload free SVG Vectors for commercial use.ConvertioConvert PNG files to SVG online & free. (One of the services provided by it.)CSS ICONIcon set made with pure css code, no dependencies, "grab and go" iconsUnified iconsThousands of icons, one unified framework. One library, over 40,000 vector icons.System UIcons220+ icons in a growing collection.IconParkTransform an SVG icon into multiple themes, and generate React icons，Vue icons，svg iconsRadix IconsA crisp set of 15×15 icons designed by the Modulz team. All icons available as individual react component,SVG and more.EOS IconsA pixel-perfect, open source iconic font available as ligature and SVG.IoniconsBeautifully crafted open source icons for use in web, iOS, Android, and desktop apps.Phosphor IconsPhosphor is a flexible icon family for interfaces, diagrams, presentationsTeeny IconsTeenyIcons is a set icons in SVG format easy to use in htmlLucideLucide is an open-source icon library, a fork of Feather Icons.IconesIcon Explorer with Instant searching, powered by Iconify.Shitty IconsCollection of Free icons.IconspediaIconspedia is a website that contains a large collection of high quality free icons.iconhubJust practical stunning icons for everyone3DICONSBeautifully crafted open source 3D iconsIconsDbFree Custom IconsEmoji GuideThe collection of 3300 emojis with their HTML codes for easy use.Unicorn Icons100+ customizable playful animated icons. Available in JSON and SVG format.Sargam IconsA collection of 275+ open-source icons available for Figma, SVGs, and React.Icon buddyA collection of 100K+ open-source SVG icons, fully customizable for designers and developers.Round IconsThe world's biggest premium and free icon packs library of flat icons, line icons, filled outline, isometric and solid styles.VectopusTop curated collective resources for elite designers.IconShelfAccess 250,000+ open-source SVG icons you can customize to fit any design or development project.All SVG IconsBrowse and download 250,000+ free SVG icons from 220 carefully curated icon libraries.SVG to ICO - A free, fast online tool to convert SVG images to ICO format for favicons and app icons.

Logos

Resources for Logos

Website DescriptionLogoSear.chSearch engine with over 200,000 SVG logos indexedSVGPorn1000+ high-quality SVG logosPayment System LogosLogos for payment systems available in png and svgBrowser LogosHigh resolution web browser logosVectorLogoZoneConsistently formatted SVG logosWorld Vector LogoDownload vector logos of brands you loveLogo MakerCreate custom logosFree Logo MakerFast, All-in-One Logo GeneratorLOGOwineBrand Logos Free Download in SVG Vector & PNG File Format

Favicons

Resources for Favicons

Website DescriptionFaviconForgeVery simple favicon generator. Download in .ico and .png formatsFavicon.ioGenerate a favicon from text, from an image, or from an emoji. Download in .ico and .png formatsFavicomaticGenerate favicons of all the sizes and formats as well as the HTML code needed to support every possible browser or deviceFavicon GeneratorGenerate favicon ico files for your websiteRealFaviconGeneratorGenerate icons for all platforms (Windows, iOS, Android)FontIconGenerate favicons and images from Font Awesome iconsFavicon.ccDraw a favicon online and browse through a library of favicons made by other usersMaskable.app EditorGenerate maskable PWA icons based on your existing iconFavicon GeneratorGenerate website's favicon assets. SVG, maskable, image minified supported. Pure frontend. No privacy risk. Fast.FaviFilesGenerate pixel-perfect favicons for free in seconds

Icon Fonts

Resources for Icon Fonts

Website DescriptionFont AwesomeThe web's most popular icon set and toolkitLine AwesomeSwap in replacement of Font Awesome with modern line iconsMaterial IconsMaterial design icon libraryIonIconsBeautifully crafted open source icons from Ionic teamZurb Foundation IconsCustomizable Foundation iconsFontisto IconsFontisto the iconic font and css toolkit · 616+ free iconsBoxiconsBoxicons is a free collection of carefully crafted open source iconsIcofont2100+ free icons to spice up your creative designsMaterial PaletteFree to pick palettes, icons and colors for Material DesignMaterial Design Iconic FontMaterial design icon fontVscode CodiconsThe icon font from Visual Studio CodeDeviconDevicon is a set of icons representing programming languages, designing & development toolsPaymentFontA sleek web font for payment operators and methods. Featuring 116 iconsWeather IconsWeather Icons is the only icon font with 222 weather themed iconsStroke 7202 thin stroke icons inspired by iOS 7Jam Icons890+ handcrafted icons to make your web app awesomeFontello200+ web icons where you can customize the names or codes of icons.LineaLinea: Featuring 750+ Free IconsUniconsA set of 1100+ Free line style icons available as web font, SVG icons, and as components for JS frameworks like React, Vue and React Native.Mobirise IconsA free, open source set of 150 elegant, pixel-perfect linear icons, available as web icon font and SVG icons.Hero IconsFree Open Source Svg Icon LibraryReact IconsAn Open Source and free Svg Icon Library, it is a collection of your favorite icon libraries like Font Awesome and Material Icons to provide you with a wide range of SVG icons to choose from.

Stock Photos

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

Website DescriptionPexelsFree stock photos shared by talented creatorsUnsplashThe internet’s source of freely usable imagesPixabayOver 1.7 million+ high-quality stock images and videosMagdeleineGallery & free high-resolution photo everydayPicspreeRoyalty free images, stock photos, illustrations, and vectorsBurstFree stock photos collectionsGratisographyFree collection of free high-resolution picturesLife of PixFree high-resolution photographyStock SnapHundreds of high quality photos added weeklyMorguefileOver 350,000 free stock photos for commercial useKaboom PicsStock photography and color palettes. Good for product imagesNew Old StockStock vintage photosPic JumboGood collections of different types of photosPublic Domain PicturesPublic domain images of all typesFind A PhotoSearches multiple stock photo websitesStockvaultCategorized stock photosPlaceholderA free image placeholder service for the web. You can specify image size and formatRealistic ShotsFree high-resolution stock photosNegative SpaceHigh-Resolution Free Stock PhotosSkitterPhotoFree high-resolution photographyPicoGraphyGorgeous, High-Resolution, Free PhotosWunder StockStunningly amazing free photosPxHereFree Images & Free stock photos - PxHerePiqselsRoyalty Free Stock PhotosFoodiesFeedFood photo stockNappyA website offering Beautiful, high-res photos of black and brown people.Generated PhotosUnique AI Generated model photosReshotUniquely free photos. Handpicked, non-stocky images.Free ImagesFind and download free stock photos - all free for personal and commercial useLorem PicsumAn easy to use API to get beautiful placeholder images. Size and other parameters can be specified.scienceimageAn image library specializing in science and nature imagesIntegration & Application Network Image LibraryFree images to provide scientists, resource managers, government agencies, community groups and graphics professionals with a resource for enhancing science communication.SaxifragaFree nature imagesCreative CommonsSearch for free images to reuse.AllTheFreeStocka curated list of free stock images, audio and videos.Lorem.space - Placeholder image generatorAPI for placeholder images but useful!OpenverseOpenverse is a search engine for openly-licensed mediaISO RepublicGet Thousands of Free High-Resolution Stock CC0 Photos

Stock Videos

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

Website DescriptionPexelsLargest library of free to use videos, donated by the communityPixabayLarge library of free to use videos, donated by the community similar to PexelsCoverr.coBeautiful free stock video footageVideezyFree HD stock footage & 4K videosMix KitStock video clips & musicLife Of VidsFree video clips and loopsVidevoFree and premium stock videosLoopvidzFree To Use Cinema graphs Created With VIMAGE AppSplitShireBeautiful & exclusive free stock videos & photosFree-Stock-VideoFree Footage Stock Videos

Stock Music & Sound Effects

Websites that offer free stock music and/or sound effects

Website DescriptionYouTube Studio Audio LibraryRoyalty-free audio library for downloadable music and sound effects. Cleared for YouTube monetization.Free Stock MusicRoyalty free stock music for YouTube videos, podcasts, etcBensoundDownload Royalty Free Music for free and use it in your projectMixkitFree music for your projectsFreesoundFree stock music and soundsFree Music ArchiveCollaborative database of creative-commons licensed sound for musicians and sound loversMusopenAn online copyright free classical music libraryPixabayFree music downloads for your project like Youtube videos, Music, Vlog, Film, Podcast etc.UnminusFree Premium Music for Your Projects 🎁 Royalty Free. Cleared for YouTube.

Vectors & Clip Art

Free vectors, clipart, illustrations, patterns and more

Website DescriptionPNGFree.aiPNGFree.ai offers millions of high-quality Free PNG imagesVecteezyFind and download free vector artFreepikFree vectors, stock photos, PSD and iconsFree VectorsCommunity of vector lovers who share free vector graphicsPNGTreepng, backgrounds, templates, text effectsVector4FreeFree vector graphicsFreebleVectors, patterns, mockups and moreLukaszadamFree Vector artworksIlllustrationsBeautiful 100 Illustrations - png, svgClipartChoose great clipart, png, coloring pages, drawings and more for your projects from the free collection!Growwwkit illustrationsA set of 8 simple, black & white, stylish illustrationstrianglify.ioGenerate low-poly backgrounds, textures, and vectorsblobGenerate Blob shapes for Web and Flutter appsHiClipartA community for designers to share & download transparent background PNG clipartsStories by FreepikA collection of free and customizable illustrations for projectsBlack IllustrationsBeautiful illustrations of black people (free and premium)DelesignA collection of free illustrations and moreCustom Shape DividersFree tool to make it easier for designers and developers to export a beautiful SVG shape dividerServier Medical Art3000 free medical images to illustrate your publications and PowerPoint presentationsClkerFree clip art you can use for anything you likeSVG waveA free, & customizable gradient 🌈 SVG wave generator for UI designs .BGjarFree svg background generator for your websites, blogs and app.Heritage LibraryVintage Illustrations (vector and png)ROBOHASHGenerate unique images from any textTabbiedCreate and customize minimally generated patterns/artwork to use for background images, print and other projects.HaikeiAn awesome multishape web app.VectorAwesome website for all kinds of Moroccan vectors.HeazyUnique vector assets within seconds.MossaikFree SVG generator with different tools, waves, tiles, blobs, and more.

Product & Image Mockups

Create mockups of devices and other products

Website DescriptionMockCityBulk generate mockups from PSD templates by automatically placing images in SmartObjects. The visual editor allows you to change SmartObject parameters and see an updated mockup preview in realtime.Smart MockupsCreate stunning product mockups (free & premium)Media Modifierbeautiful design mockups service for your products (free & premium)Shot SnapCreate beautiful device mockup images for your app or website designScreelyInstantly turn your screenshot into a mockupScreenshot.rocksCreate beautiful browser & mobile mockups in secondsScreen PeakCreate a mockup from a URLMockup WorldThe biggest source of free photo-realistic Mockups onlineCollab ShotReal-time screen grabs and image sharingFacebook DevicesImages and Sketch files of popular devicesThreed.ioGenerate 3D mockups right in your browser.Mockuphone100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TVDevice ShotsCreate high-resolution device mockups for social media, for freeClean MockCreate stunning mockups using latest device frames like iPhone X & custom backgrounds that make your mobile or website design standout, right from your browser quickly & for free.Mock.VideoInstantly create mockups by adding a device frame to your videos.MockupBroCreate product mockups with online mockup generator! Just choose a mockup, upload your design and download your image without a watermark.AnimockupCreate animated mockups in the browser 🔥.HeroshotAutomate documentation screenshots with visual element picker and theme-aware outputPikaInstantly create browser mockups and beautiful images for marketing, blog post and moreLunacyCreate mockups from scratch for freePodifai Mockup GeneratorFree online 3D mockup generator for product photos, branding, and e-commerce. No signup required

HTML & CSS Templates

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

Website DescriptionHTML5UpVery modern, unique responsive HTML5/CSS3 themesTemplatemoMinimal, resume, gallery themes and moreFreeHTML5Free & premium HTML5 and Bootstrap themesStyleShoutBrilliantly crafted free website templatesStart BootstrapBootstrap starter themesThemeWagonCollection of HTML5 Bootstrap templates from different categoriesColorlibAlmost any category of theme you can think ofFree CSSHuge collection of free templatesHubspotTemplates, infographics, banners and much moreMobiriseGreat looking HTML5/CSS3 templatesBootswatchFree themes for BootstrapOnepageloveOne-page websites, templates and resourcesThemes For AppFree Bootstrap themes and landing pagesBootstrapTastePremium & Free Bootstrap TemplatesBootstrapMadeElegant, clean and beautiful free templates using Bootstrap.W3LayoutsW3Layouts: 3784+ Free Website Templates for 2020TooplateTooplate: Free HTML Templates for everyone!CruipFully coded HTML templates to help you easily build your startup landing page without hassles.UIdeckFree Landing Page Templates and Bootstrap ThemesSplawrFree web templates to kickstart your idea!W3css_templatesSome responsive W3.CSS website templates for you to use.All-Free-DownloadDownload free-website-templatesmashup-templateHTML5/CSS3 Free TemplatesSneat Bootstrap 5 HTML Admin TemplateOpen-source & Easy to us Bootstrap 5 HTML Admin Template with Elegant Design & Unique Layout.HTMLrevFree beautiful HTML5 templates and landing pagesHorizon UITrendiest open source Admin Template for ReactKeenThemesFree and Pro Html/Css3, Bootstrap5, Vue, React, Laravel templatesScrewFastOpen-source Astro website template with sleek, customizable TailwindCSS components

CSS Frameworks

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

Website DescriptionTailwind CSSLow level, utility-first frameworkBootstrapPopular UI framework with tons of components that use both CSS and JSMaterializeA modern responsive front-end framework based on Material DesignMaterial Design LiteLight framework based on Material Design. No JS dependencyBulmaModern CSS framework with no JSSkeletonExtremely light framework for basic UI elementsUniform CSSFully configurable utility generator and CSS framework built entirely in SassSemantic UIEmpowers designers and developers by creating a shared vocabulary for UIFomantic UIA community fork of Semantic-UIFoundationMobile first framework with clean markupPure CSSA set of small, responsive CSS modulesUIKitLightweight and modular front-end frameworkSusyLightweight, grid-layout engine for SassMilligram.ioMinimalist CSS frameworkVanilla FrameworkSimple, extensible CSS framework written in SassSpectre CSSLightweight, modern CSS frameworkPicnic CSSLightweight and beautiful libraryWingA beautiful CSS framework designed for minimalistsChotaA micro (~3kb) CSS frameworkBlueprint CSSA lightweight layout library for building great responsive mobile first UIs that work everywhereW3.CSSA modern CSS framework with support for desktop, tablet, and mobile design by default. Designed to be independent of jQuery or any other JavaScript library98.cssA design system for building faithful recreations of old UIsNES CSSNES-style CSS FrameworkShoelace.cssLightweight, forward-thinking CSS library built with future CSS syntaxMVP.cssA minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you're doneBlaze.cssOpen source modular CSS toolkit providing great structure for building websites quicklyTurret CSSTurret CSS is a styles framework for development of responsive websites.CutestrapA strong, independent CSS Framework.XP.cssXP.css is an extension of 98.css. A CSS library for building interfaces that look like old UIs.Framework7Framework7 - is a free and open source framework to develop mobile, desktop or web apps with native look and feel.Hint.cssA pure CSS tooltip library for your lovely websites.imagehover.ioPure CSS Image Hover Effect Librarymini.cssA minimal, responsive, style-agnostic CSS frameworkTachyonsCreate fast loading, highly readable, and 100% responsive interfaces with as little css as possible.Material BootstrapMaterial Design with BootstrapIvoryA modern CSS framework for developing powerful web interfaces faster and easierHalfmoon UIA responsive and lightweight framework, designed for quickly building beautiful dashboards and product pages.Metro 4Create your site quickly and effectively with Metro 4. impressive components library built on html, css, javascript.css-doodleA web component for drawing patterns with CSSlatex.cssMake your website look like a LaTeX documentPaper CSSFront-end printing solutionWindi CSSNext generation compiler for Tailwind CSSCirrus CSSA component and utility centric SCSS framework designed for rapid prototyping.GutenbergModern framework to print the web correctly. litWorld's smallest responsive fire css framework (395 bytes). ArwesArwes is a web framework to build user interfaces based on futuristic science fiction designs, animations, and sound effects. BojlerBojler is an email framework for developing responsive and lightweight email templates that will render correctly across each of the most popular email clients. TacitPrimitive CSS Framework for dummies, without classes. Terminal CSSA modern and minimal CSS framework for terminal lovers. SakuraA minimal classless css framework / theme. DAUBConsidered CSS component library — 73 components, 20 theme families, classless mode, AI-ready with llms.txt and MCP server. Zero build stepPSonePS1 style CSS Framework, inspired by NES.css. MarxMarx is the classless CSS reset to be used in any projects (namely small ones). TufteStyle your webpage like Edward Tufte’s handouts. AxentixAxentix is an open source Framework based on CSS Grid using HTML, CSS and JS.Raster Simple Grid SystemMinimal and straight-forward CSS grid system utilizing descriptive HTML rather than semantic CSS.flowriftFlowrift is a library made of beautifully designed Tailwind CSS UI blocks.twindThe smallest, fastest, most feature complete tailwind-in-js solution in existencePico.cssElegant styles for all natives HTML elements without .classes and dark mode automatically enabled.clay.cssExtensible and configurable micro CSS util class and SASS mixin for adding claymorphism styles to your components.BeerCSSBuild Material Design interfaces in record time, without stress for devs 🍻. The first CSS framework that implements Material Design 3.UnoCSSUnoCSS is the instant atomic CSS engine, that is designed to be flexible and extensible. The core is un-opinionated, and all the CSS utilities are provided via presets. StyleXStyleX is a simple, easy-to-use JavaScript syntax and compiler for styling web apps. OrbitOrbit is the first CSS framework for creating simple or complex radial interfaces.

CSS Methodologies

CSS methodologies to help write modular, reusable and scalable code

Website DescriptionOOCSSOOCSS concepts help us write components that are flexible, modular and interchangeable.Atomic CSSAtomic CSS is the approach to CSS architecture that favors small, single-purpose classes with names based on visual function.BEMBlock Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development.SMACSSSMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process.CUBECUBE CSS is a CSS methodology that’s orientated towards simplicity, pragmatism and consistency.

CSS Animations

CSS animations to build awesome animations for websites and applications

Website DescriptionGradienty AnimationsOver 600+ Curated Animations ready to copy & paste.Animate.cssJust-add-water CSS animationsBounce.jsBounce.js is a tool and JS library that lets you create beautiful CSS3 powered animationsAnime.jsAnime.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 ObjectsMagic AnimationsAnimations has been one of the most impressive animation libraries availableZdogRound, flat, designer-friendly pseudo-3D engine for canvas & SVGCSShakeCSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web pageHover.cssHover.css is a CSS animation library designed for use with buttons and other UI elements in your websiteAniJSAniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structureAnimistaCSS Animations On DemandTachyons-animateTachyons itself is an atomic CSS library with a ton of utility classes for essentially designing anything by adding classes to what you needSequence.jsSequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applicationsInfiniteThese animations, like rotations and pulses, that are specifically designed to run and repeat foreverOBNOXIOUS.CSSAnimations for the strong of heart, and weak of mindMOTION UIA Sass library for creating flexible CSS transitions and animationsKeyframes.appA graphical user interface for generating custom CSS keyframe animationsthoughtbotCSS Transitions and Transformations for BeginnersSVG ArtistaA useful tool to animate stroke and fill properties in SVG images with plain CSS codeAnimXYZAnimXYZ helps you create, customize, and compose animations for your website. Built for Vue, React, SCSS, and CSSWhirlCSS loading animations with minimal effort!HamburgersHamburgers is a collection of tasty CSS-animated hamburger icons. Also included is the source as a Sass library. It’s modular and customizable, so cook up your own hamburger.CSS Loaders & SpinnersThis is a library having a collection of different types of CSS loaders, spinnersMotion OneA new animation library, built on the Web Animations API for the smallest filesize and the fastest performance.pocolocoGenerate dynamic backgrounds for your websiteAniXSuper easy and lightweight css animation library.AOSAnimate On Scroll Library.AnimatopyJust-add-water CSS animations snippets

Javascript Animation Libraries

javascript animations libraries to build awesome animations for websites and applications

Website DescriptionGSAPA JavaScript library for building high-performance animations that work in every major browserVelocity.jsVelocity is a lightweight animation engine with the same API as jQuery's $.animate()lax.jsSimple & light weight vanilla javascript plugin to create smooth & beautiful animations when you scroll!Rellax.jsA buttery smooth, super lightweight, vanilla javascript parallax librarythree.jsAn easy to use, lightweight, 3D library with a default WebGL renderer.AtroposAtropos is a lightweight, free and open-source JavaScript library to create stunning touch-friendly 3D parallax hover effects.wow.jsReveal Animations When You Scroll.chocolat.jsFree lightbox plugin.Animate On ScrollAnimate on scroll library to reveal animations when You scroll.Tilt.jsA tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery.RoughnotationRough Notation is a small JavaScript library to create and animate annotations on a web pagetsParticlesA lightweight library for creating particles, an improved version of the abandoned and obsolete particles.jsParticles.jsA lightweight JavaScript library for creating particlesmo.jsThe motion graphics toolbelt for the webLightbox2A small JS library to overlay images on top of the current page.SlickFully responsive carouselbarba.jsCreate fluid and smooth transitions between your website’s pages.Locomotive ScrollA simple scroll library that provides detection of elements in viewport & smooth scrolling with parallax.Owl carouselFree responsive jQuery carouselSwiperjsFree, Open Source, Modern Slider without jQuery. Available for Vanilla JS and all modern frameworks like React, Vue, Angular etc.SplideFree, pure JS library for carousels and slidersSimple ParallaxThe easiest way to get a parallax effect with javascriptKUTE.jsKUTE.js is a JavaScript animation engine for modern browsers.Granim.jsCreate fluid and interactive gradient animations with this small javascript library.PopmotionSimple animation libraries for delightful user interfaces.VivusVivus is a lightweight JavaScript class (with no dependencies) that allows you to animate SVGs, giving them the appearence of being drawn.Typed.jsA JavaScript Typing Animation Library.Progress Bar.jsResponsive and slick progress bars with animated SVG paths.Midnight.jsMidnight.js lets you switch fixed headers on the flyTingle.jsTingle is a simple modal plugin written in pure JavaScriptTheatre.jsTheatre.js is a JavaScript animation library with a GUI. It animates the DOM, WebGL, and any other JavaScript variable.splidejsSplide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.nice-wavesBeautiful animated wavesVanta.jsAnimated website backgrounds in a few lines of code.Splitting.jsSplitting creates elements and adds CSS variables to unlock amazing possibilities for animating text, grids, and more!

Javascript Chart Libraries

Libraries that help developers visualize data into charts

Website DescriptionChartJSSimple yet flexible JavaScript charting for designers & developersFrappeJSIncludes Green squares grid like in GitHub, and other charts to use.G2PlotG2Plot is an interactive and responsive charting library based on the grammar of graphics.Google ChartsGet the experience from Google to create similar charts that Google uses.Data Driven Documents (D3)Bind complicated and massive data to interactive graphs.ApexCharts.JsModern & Interactive Open-source ChartsChartistSimple responsive chartsVizzuVizzu - a free, open-source Javascript library for building animated charts, data stories, and interactive explorers.AntVAnt Design Charts, free JS Charts library for dynamic data with excellent documentationNivoNivo provides supercharged React components to easily build dataviz apps, it's built on top of d3. Also comes with server side rendering ability and fully declarative charts.EchartsAn Open Source JavaScript Visualization Library with declarative syntax for Rapid Construction of Web-based VisualizationVChartVChart is not only a multi-terminal chart library that can be used out of the box, but also a vivid and flexible data storyteller.VTableVTable is a high-performance multidimensional analysis component developed based on Canvas. When compared with traditional DOM table components, VTable primarily addresses rendering and interaction performance issues in the context of large amounts of data.VStoryVStory is a feature-rich narrative system that can use VisActor's VChart and VTable, combined with built-in components, to create visual works.

UI Components & Kits

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

Website DescriptionCSSnippetsExplore a vast collection of HTML, React, CSS and Tailwind CSS code snippets for buttons, box-shadows, cards, checkboxes, dropdowns and many more.BitProvides a huge library of reuseable UI Components for React, Angular, Vue, React Native. Also can be used for sharing UI Components among other team membersUILangA minimal, UI-focused programming language for web designersMedialoot CSS ComponentsCalendars, price grids and other UI componentsFroala Design BlocksOver 170 responsive design blocks ready to be used in your web or mobile appsFlowbiteOpen-source library of Tailwind CSS componentsdaisyUITailwind CSS ComponentsMui TreasuryAn open-source project that provides a collection of ready-to-use components based on Material-UI.Material Design For BootstrapOpen source toolkit for building material design with BootstrapPhotonkitDesktop UI library for ElectronFlat UIMinimal free user interface kitShardsA free and modern UI toolkit for web makers based on BootstrapThemesbergFree and open-source website themes, templates, and UI kits based on Bootstrap and ReactCreative TimAll types of UI libraries and kits including JS frameworks like ReactBrumm Shadow MakerAn online tool to make css shadowsAdminLTEBest open source admin dashboard & control panel themeSpinKitSimple CSS SpinnersEpic SpinnersCSS spinners collection with Vue.js integration.Loading.ioOnline service provider for creating simple animations, spinners, progress bar and moreMoving LettersAnimated Text with JavaScript and anime.jsCSS LayoutA collection of popular web layouts and patterns in pure CSSCSS Grid GeneratorAn open-source project that allow users to quickly create dynamic layout based on CSS Grid.HTML Table GeneratorCreate semantic, responsive & accessible HTML tables to represent your tabular data. Set CSS properties, generate the code and copy & paste into your project.CodyhouseKick-start your web projects with CodyHouse's front-end framework and library of accessible HTML, CSS, JavaScript componentsTailwind Starter KitTailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open SourceTailwindtoolboxOpen source starter templates and components, a plugins directory and useful tools/utilities to kick start your Tailwind CSS project.tailwindcomponentsA free repository for community components using TailwindCSSsweetalertSweetAlert makes popup messages easy and pretty.sweetalert2A beautiful, responsive, customizable, accessible replacement for javascript's popup boxestailblocksOpen source ready-to-use Tailwind CSS components.FastAn interface system that can be used with modern Web Frameworks such as React, Vue and Angular.LottieFiles Interactive animations in many formats like json,gif and mp4, libraries and plugins for Web & Mobile .KuttyA set of accessible and reusable prebuilt Tailwind components that are commonly used in web applications.Tailwind TemplatesA free collection of Tailwindcss Templates - tailwind components for rapid UI development.StitchesAn HTML template generator using functional css.Meraki UI ComponentsBeautiful Tailwindcss components that support RTL languages & fully responsive based on Flexbox & CSS Grid.Daemonites Material Design For BootstrapDaemonite's Material UI is a cross-platform and fully responsive front-end interface based on Google Material Design developed using Bootstrap 4StitchesCSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.Headless UICompletely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.Styled componentsBuild beautifully UI Components, for your applications & websites.Figma Bootstrap 5 UI KitUI Kit comprising 300+ organized Bootstrap 5 components built with atomic design system & auto layout.NotiflixJavaScript library for client-side non-blocking notifications, popup boxes, loading indicators, and more that makes your web projects much betterCoreUIBootstrap Admin Dashboard Template & UI Components LibraryAgnosticUIAccessible React component primitives that also work with Vue 3, Svelte, and AngularSVGRSVGR is an universal tool to transform a raw SVG into a ready-to-use React components. Available online, in CLI, Node.js, as a webpack/rollup/parcel plugin...uiverseHundreds Open-Source UI elements, made with HTML & CSS. Anyone can contribute. Includes buttons, checkboxes, spinners, cards, inputs and more.HyperUIFree open source Tailwind CSS components for marketing and ecommerce websites, as well as application UI.Flowbite Admin DashboardFree and open-source admin dashboard template built with Tailwind CSS and Flowbite featuring 15 examples pages, charts, widgets, and dark mode.Wicked BlocksA free collection of Tailwind blocks & componentsMamba UIMamba UI is a free, open-source collection of UI components and templates based on Tailwind CSS.KitwindFully responsive UI kits, built with Tailwind CSS.DevUIFree and Open-Source UI Components for Maximum Productivity.Tail-KitTail-kit gives you access to over 250 free components and free templates, based on Tailwind CSS 3.0.Float UIFree and open-source UI components and website templates using Tailwind CSSKonsta UIPixel perfect mobile UI components built with Tailwind CSSReact Native Gifted ChatA chat UI component that offers a ready-to-use chat interface with features like message bubbles, input toolbar, and more.Wind UIExpertly made, responsive, accessible components in React and HTML ready to be used on your website or app.SonnerAn opinionated toast component for React.PinesPines is a library of animations, sliders, tooltips, accordions, modals, and more! It's a set of UI elements that can be copy and pasted into any Alpine and Tailwind projects.Kuma UIWith Kuma UI's headless, zero-runtime UI components, build top-performing websites effortlessly, while enjoying the best developer experience. Say hello to the future of CSS-in-JS.Shadcnui BlocksEffortless Shadcn UI Component Previews & Code Snippets.Shadcn studioPreview your theme changes across different components and layouts.BunduiDiscover a curated collection of over 200 handcrafted UI components made with Tailwind CSS, React, and Shadcn UI.Shadcn ExamplesExamples and components built with React and Tailwind CSS, compatible with Shadcn UI.Shadcn AdminA multipurpose admin dashboard template for React, Next.js, and Vue.js. Fully compatible with shadcn/ui.

React UI Libraries

UI and component libraries for the React JavaScript framework

Website DescriptionMaterial UIReact components for faster and easier web development, based on Material DesignChakra UIBuild accessible React apps & websites with speed. Openchakra React BootstrapBootstrap rebuilt for React. Include Bootstrap components right in your JavaScriptSemi DesignA modern, comprehensive, flexible design system that gives you all modular blocks you need to build sensible web apps & SaaS products.MantineReact components and hooks library with native dark theme support focused on usability, accessibility and developer experience.HeroUI - Previously NextUIBeautiful, fast and modern React UI library that allows you to create beatiful websites regardless of your design experience.Arco DesignA comprehensive React UI components library based on the Arco Design system.ui-playbookThe documented collection of UI componentsReactStrapAnother Bootstrap UI library for ReactReact AdminA frontend Framework for building admin applications. Supports API's out of the boxBlueprintJSReact-based UI toolkit for the webReact Semantic UIUI components based off of the Semantic UI frameworkShards ReactReact UI kit featuring a modern design system with dozens of custom componentsReact VirtualizedUI set for data. Includes tables, lists, sorting, etc.React ToolboxMaterial design UI library for ReactElastic UIDistributes UI React components and static assets for use in building web layoutsReact DesktopDesktop styled components in React. Includes MacOS and Windows based componentsTheme UIBuild consistent, themeable React apps based on constraint-based design principlesOnsen ReactDistributes Components for hybrid mobile apps with React and Onsen UIEvergreenDesign system for ReactRebassReact primitive UI components built with styled systemGrommetmobile first UI component libraryLanding Page TemplateOpen source landing page template for reactElemental UIA UI Toolkit for React.js Websites and AppsAnt DesignOpen source design React UI library.BumbagBumbag is a friendly React UI Kit suitable for MVPs or large-scale applications.PRIMEREACTThe ultimate collection of design-agnostic, flexible and accessible React UI ComponentsPrimer ComponentsPrimer Components are React components which implement GitHub's Primer Design SystemOrbitDesign system and React UI components for travel projects.Base WebBase Web provides a robust suite of components out of the boxBackpack UIBackpack is the Lonely Planet toolset that we use to build front end apps.ReavizData visualization library for React based on D3React SuiteA suite of React components, sensible UI design, and a friendly development experience.React SpringSpring-physics based animation library for React applications.RechartsA composable charting library built on React components.Vercel UIModern and minimalist React UI libraryFramer MotionA React library to power production-ready animations.React SpectrumA React implementation of Spectrum, Adobe’s design system.@tsparticles/reactA lightweight React component for creating particlesparticles-bgA React particles animation background componentTreactGallery of free and modern React templates and UI components developed using TailwindCSS as the front-end frameworkOAH-Admina free React admin dashboard template based on Gatsby with oah-ui components and elements package.Carolina Admin DashboardFree React admin template is powered by Material-UI components framework and features a clean and fresh design following Google's Material Design specifications.TablerTabler is a free React admin dashboard template ideal for any kind of back-end web application.Sha-el-designReact components for easier customization and smooth development flow.React-WeUIReact-WeUI made from our love of React and WeChat's WeUI Design.Supabase UIAn open-source UI component library inspired by Tailwind and AntDesign.Ring UIA collection of JetBrains Web UI components.React95Refreshed Windows 95 style UI components for your React app.ReakitReakit is a lower level component library for building accessible high level UI libraries, design systems and applications with React.ZentA collection of essential UI components written with React.GestaltA set of React UI components that supports Pinterest’s design language.xstyledA CSS-in-JS framework built for React with props based utilities like display, fontSize or rotate.@use-gestureBread n butter utility for component-tied mouse/touch gestures in React.React RainbowReact Rainbow is a collection of components that will reliably help you build your application in a snap.React Use Smooth ScrollReact Provider Component to add a smooth scroll effectChoc UIChoc UI is a set of accessible and reusable components that are commonly used in web applications.ElementzA React Component library for buliding modern applications easily & quickly.Base UIUnstyled UI components for building accessible web apps and design systems. From the creators of Radix, Floating UI, and Material UI.Radix UIUnstyled, accessible components for building high‑quality design systems and web apps in ReactMaterio MUI React NextJS Admin TemplateMost Powerful & Comprehensive Open-source MUI React NextJS Admin Dashboard Template built for developers.Chakra TemplatesA growing collection of hand-crafted & responsive Chakra UI templates ready to drop into your React project.React Resizable PanelsReact components for resizable panel groups/layouts.Carbon ReactExtensive library of React components for Websites and UI's. Based on the Carbon Design System from IBMReact AriaA library of React Hooks that provides accessible UI primitives for your design system.shadcn/uiBeautifully designed components built with Radix UI and Tailwind CSS.TremorReact components to build charts and dashboards withAceternity UICopy paste the most trending components and use them in your websites without having to worry about styling and animations.Magic UIfree and open-source animated components built with React, Typescript, Tailwind CSS, and Framer Motion.Code UIBeautifully designied mobile responsive components built with HTML, CSS , JS and React, Typescript, Tailwind CSS, and Framer Motion. 100% open-source, and customizable.Edil OziComponent Library for Developers. Open Source components you can copy and paste to your apps.Shadcn TemplatesFree collection of Shadcn UI templates, components, blocks, boilerplates, and more.Eldora UICollection of re-usable components that you can copy and paste into your web apps. It primarily features components, blocks, and templates.StyleSeedDesign engine that makes Claude Code and Cursor produce professional UI. 48 shadcn-style React components, 69 design rules, 11 AI slash-command skills, and swappable brand skins (Toss, Stripe, Linear, Vercel, Notion) on Tailwind CSS v4 + Radix UI.

Vue UI Libraries

UI and component libraries for the Vue JavaScript framework

Website DescriptionVuetifyMaterial design component frameworkBootstrap VueUse Bootstrap components with VueBuefyLightweight UI components based on BulmaSemantic UI VueSemantic UI Vue is the Vue integration for Semantic UIArco Design VueA comprehensive Vue UI components library based on the Arco Design system.VEUIVEUI is an enterprise UI component library, based on Vue.js.GraceDesign System For Vue Applications.QuasarHigh-performance Material Design component suite with builders for SPA, SSR, PWA, Mobile (Cordova & Capacitor), Desktop (Electron) and Browser extensionsElementDesktop UI library for VueFish UIVue UI toolkit for the webKeen UIVueUI library with a simple API, inspired by Google's Material DesignMaterio Vuetify Vuejs Admin TemplateOpen-source & Easy to use Vuetify Vuejs Admin Template with Elegant Design & Unique LayoutOnsen VueDistributes Components for hybrid mobile apps with Vue and Onsen UIVuejsexamplesA nice collection of useful vuejs UI componentsInklineInkline is a modern UI/UX Framework for Vue.js designed for creating flawless responsive web applicationsVuesaxUnique and reusable UI componentsAntdvUI library for Vue based on Ant DesignShards VueA high-quality & free Vue UI kit featuring a modern design system with dozens of custom componentsPrime VuePowerful yet simple to use, versatile, performant Vue UI Component Library to help you build stunning user interfaces.Chakra UI VueChakra UI is a simple modular and accessible component library that gives you the building blocks to build Vue applications with speed.View UIDozens of useful and beautiful Vue components made for people with all skill levels with extensive documentation.@tsparticles/vue2A lightweight Vue 2.x component for creating particles@tsparticles/vue3A lightweight Vue 3.x component for creating particlesTC ComponentsA library of high-quality ready to use components that will help you speed up your development workflow.VantLightweight Mobile UI Components built on Vue.Equal UIOpen-source Vue 3 components system for your next project based on TypeScriptMint UIMobile UI elements for Vue.jsCube UIA fantastic mobile ui lib implement by Vue.jsMuse UIBased on the Vue 2.0 elegant Material Design UI component libraryAT-UIAT-UI is a modular front-end UI framework for developing fast and powerful web interfaces based on Vue.js.VuikitA consistent and responsive Vue UI library, based on the front-end framework UIkit.Wave UIA Vue.js UI framework with only the bright side.VueTailwindSet of Lightview and fully customizable Vue Components optimized for TailwindCSS.OrugaOruga is a lightweight library of UI components for Vue.js without CSS framework dependency.BalmUIBalmUI is a modular and customizable Material Design UI library for Vue.js.Weex UIA rich interaction, lightweight, high performance UI library based on Weex.VarletVarlet is a Material design mobile component library developed based on Vue3, developed and maintained by partners in the community.Naive UIA Vue 3 Component Library. Fairly Complete. Customizable Themes. Uses TypeScript. Not too Slow.VuesticFree and Open Source UI Library for Vue 3 🤘.Vue Final ModalVue Final Modal is a tiny, renderless, mobile-friendly, feature-rich modal component for Vue.js.VuetensilsVuetensils is a lightweight component library for Vue 2.x that brings some of most common UI features, but only the bare minimum styles to avoid adding any extra bloat. You can work on the branding, and don't have to worry about the accessibility.NuxtLabs UIFully styled and customizable components for Nuxt.shadcn-vueVue port of shadcn-ui.

Angular UI Libraries

UI and component libraries for the Angular JavaScript framework

Website DescriptionMaterial AngularUI library for Angular based on Material designNG BootstrapUI library for Angular based on the Bootstrap frameworkPrimeNGPowerful UI component library for AngularOnsen AngularHybrid mobile and PWA UI library for Angular and Onsen UING LightningNative Angular components & directives for Lightning Design SystemNG SemanticUI library for Angular based on Semantic UINebularCustomizable UI Kit, Auth & Security for AngularAlyle UIMinimal components set for AngularNGX BootstrapAnother UI library for Angular based on the Bootstrap frameworkNG ZorroUI library for Angular based on Ant DesignPagination for datatablesnpm library for paginationMulti select dropdownFor multi select drop-dowm in formsNG ParticlesA lightweight Angular component for creating particlesCovalent UIAngular UI Platform focused on solving common enterprise needsClarityCSS based Angular UI framework developed by VMware groupTaiga UITaiga UI is fully-treeshakable Angular UI Kit consisting of multiple base libraries and several add-ons.ngx-adminAdmin template based on Angular 10+ and NebularspartanCutting-edge tools powering Angular full-stack development.

Svelte UI Libraries

UI and component libraries for the Svelte JavaScript compiler

Website DescriptionSvelte Material UIUI library for Svelte based on Material DesignSvelteStrapUI library for Svelte based on the Bootstrap frameworkSvelte Flat UIUI library for Svelte based on Flat DesignAttractionsA pretty cool UI kit for SvelteSvelteitA minimalistic UI/UX component library for Svelte and Sapper projectsCarbon Components SvelteA component library that implements the Carbon Design System, an open source design system by IBM.Radix SvelteThis is a port of Radix UI for Svelte.shadcn-svelteshadcn-svelte is an unofficial community-led Svelte port of shadcn/ui.SkeletonSkeleton is an open source UI toolkit built with Svelte + Tailwind that allows you to create reactive web interfaces using Svelte + Tailwind CSS.Aceternity UI SvelteFree Incredible Animated Components.Svelte UXCollection of Svelte components, actions, stores, and utilities to build highly interactive applications.Flowbite-SvelteFlowbite-svelte is an open-source UI component library built with Svelte components, Tailwind CSS utility classes and based on the Flowbite design systembits-uiThe headless components for Sveltemelt-uiA set of headless, accessible component builders for Svelte

React Native UI Libraries

UI and component libraries for the React Native Framework

Website DescriptionMagnus UIMagnus UI is the ultimate UI framework that helps you in building consistent user interfaces effortlessly in react nativeReact Native UI LibReact Native UI (RNUI) is a UI Toolset & Components Library for React Native from WixReact Native PaperReact Native Paper is a high-quality, standard-compliant Material Design library that has you covered in all major use-casesUI KittenUI Kitten is React Native framework for creating stunning cross-platform mobile applications. Design system based, brings your product from MVP to enterprise.React Native ElementsCross Platform React Native UI Toolkit that provides an all-in-one UI kit for creating apps in react native.NativeBaseEssential cross-platform UI components for React Native & Vue Native.Shoutem UIShoutem UI toolkit enables you to build professionally looking React Native apps with ease.tailwind-rnUse Tailwind CSS in React Native projects.Ant Design Mobile RNAn Ant design based configurable Mobile UI component library based on React Native.SnackUISnackUI is a UI Kit for React Native + react-native-web that's much faster rocket with an optimizing compiler.MotiMoti is the universal animation package for React NativeTamaguiUniversal React design systems that optimize for native & web.

Design Systems & Style Guides

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

Website DescriptionMaterial DesignGoogle's Material DesignAnt DesignDesign system for enterprise-level productsApple Design ResourcesGuides and templates for using Apple design and UIPrimerDesign, build, and create with GitHub’s design systemArco.designAn enterprise-level design system jointly launched by the Bytedance GIP UED team and the architecture front-end team.Alta UIOracle's design system and toolkitPulseDesign system, guides and React component libraryBoltRobust Twig and web component powered UI componentsClarity Design SystemUX guidelines, HTML/CSS framework, and Angular componentsAtlasKitAtlassian's official UI library, built according to the Atlassian Design GuidelinesAudi Design ResourcesAudi UI design system and toolkitCarbon Design SystemsCarbon is IBM’s open-source design system for products and experiencesYelp Style GuideYelp style guide, components and toolkitCometScalable design system of visual language, components, and design assetsETrade Design SystemGuides and toolkits that blend finance with simplicity and ease of useFundamental LibraryOpen source and community driven project for consistent user interfacesInfor DesignGuidelines and resources to create meaningful experiences for Infor’s productsLexiconAn experience language for crafting beautiful UIMarvel Style GuideSet of design principles and componentsMicrosoft Fluent UICollection of UX frameworks from MicrosoftPluralsight Design SystemDesign guide with components for designing with PluralsightPolarisDesign system that creates great experiences for all of Shopify’s merchantsMozilla ProtocolProtocol is a design system for Mozilla and Firefox websitesSendGrid Style GuideUI library for developing consistent UI/UX at SendGridVTEX StyleguideReusable patterns, components and assets related to product design in VTEXRizzoStyle guide with UI components, JS components, widgets, etcAtomizeUI framework that helps developers collaborate with designers and build consistent user interfaces effortlesslyStyleGuides.ioA directory of 500+ styleguidesDone Design SystemOpen source design system, guides & componentsSkoda Brand SystemDesign guideline for developing applications under the Skoda brandSpectrumAdobe’s design system that provides components and tools to help product teams work more efficiently, and to make Adobe’s applications more cohesive.AsphaltGojek’s design language system. A collection of guidelines and components to create amazing user experiences.Laws of UXA collection of the key maxims that designers must consider when building user interfaces.Checklist DesignChecklist Design is a curated list of checklists ranging from website pages, to UI components, all the way to branding assets.Humane By DesignA resource that provides guidance for designing ethically humane digital products through patterns focused on user well-being.Pr1mer GuidelinesAn open source set of very general guidelines, inspired by Human Interface. Created and maintained by Pr1mer TechPatterflyPatternFly is an open source design system from Red Hat, Inc.PatternsA resource to improve on design patterns and component patterns for building powerful web apps with vanilla JavaScript and React.Design Principles For DevelopersA resource to improve Design principles and guidelines for developers.Once UIOpen-source design system for Next.js with 100+ components, deployment-ready app templates, and Figma integration

Online Design Tools

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

Website DescriptionFigmaOnline graphic design tool (Free & paid options)PenpotPenpot is the first Open Source design and prototyping platform meant for cross-domain teams. Non dependent on operating systems, Penpot is web based and works with open web standards (SVG). For all and empowered by the community Open Source and selfhostable VectrFree vector graphics softwareTalerCreate social media banner designs in minutes from hundreds of customizable templatesCanvaCreate beautiful designs (Free & Paid)Get WavesA free SVG wave generator to make unique SVG waves for web designClippyEasy CSS clip-path makerFancy Border RadiusEight values specifying border-radius in CSS ( border-radius generator )Wireframe.ccWireframing tool (free & paid)FotorPhoto editor and design makerPixlrOnline photo editorAnimoto Video MakerMake videos onlineRemoveBGRemove image backgroundsPhoto CreatorCreate your own photos instead of searching for stockVismeCreate presentations, infographics and moreInfogramCreate infogramsChartGoCreate charts and graphs onlineCartoon PhotoTurn photos into cartoonsWhimsicalWireframes, diagrams and more (4 free)WhiteboardOnline drawing toolOctopusSitemap builderOnlineboardReal-time shareable whiteboard for brainstormingCTA Button MakerCreate call to action buttonsBlobmakerBlobmaker is a free generative design tool, to help you quickly create random, unique, and organic-looking SVG shapes.PersonasA playful avatar generator for the modern agePhotopeaAn Online Photoshop editorExcalidrawVirtual whiteboard for sketching hand-drawn like diagramsDiagramsDiagram software and Flowchart makerMermaidrenders Markdown-inspired text definitions to create and modify diagrams (like flowchart, sequence diagram, gantt, or user journey) dynamically. (FOSS)MapInSecondsSimple way to visualize your data with a mapGrid MalvenA css grid cheatsheet to reference when creating a css gridFlex MalvenA flexbox grid cheatsheet to reference when working with flexboxSmart UpscalerUpscale images by 2-4x resolution (4 free)GetAvataaarsFun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch libraryBig HeadsEasily generate avatars for your projects with Big Heads by Robert Broersma.WebflowBreak the code barrier, Build better business websites, faster. Without coding.TraceInstantly remove the background from your photosNeumorphism.ioGenerate Soft-UI CSS shadow codeDB DesignerDesign your database for free onlineUi BakeryCreate full-fledged web apps visuallyFauxTurn real code into faux codeRiveReal-time interactive design tool that allows you to design, animate, and immediately integrate your assets into any platform.UnscreenRemove Video Background 100% Automatically and FreeKodeshotConvert your source code into nice pictures for your articles, tweets, messages, posts...WixCreate a Website You’re Proud OfGTmetrixWebsite Speed and Performance OptimizationYellow Lab ToolsOnline test to help speeding up heavy web pagesFramerIs prototyping tool for teamsDraw.ioFree online diagram editor toolUXWing SVG EditorCreating and Edit SVG OnlineCSS ArrowCreate and export CSS code for a custom box with an arrow extending out from the side. Great for tooltips, flyouts and the like.LucidchartDiagramming and visualization tools that allows creating databases, flowcharts, boards, floor-maps, and much more. 3 multi-page documents on the free tierCarbonCreate and share beautiful images of your source code by typing or drop a file.PixCleanerAccurate and hassle free background removal toolGlass UIA modern CSS UI library based on the glassmorphism design principles that will help you quickly design and build beautiful websites and applications.GlassmorphismAn incredible online tool for generating quick glassmorphic UI in CSS code snippets.TableConvertTable Convert Online is a web-based tool to converts Excel, URL, HTML, Markdown table and CSV to Markdown table, CSV/TSV, JSON, XML, YAML, insert SQL, HTML, Excel and LaTeX table.Doodle IpsumThe lorem ipsum of illustrations. Just customize your doodles, grab the code, and use them on your web prototypes, landing pages, or no-code tools.FigenPost Cover & Background Generator ToolWindframeA tool to rapidly prototype and build stunning websites using Tailwind CSS (Free & Premium)SlickrA tool for designing cover image for your blog.Shadow Palette GeneratorCreate a set of lush, realistic CSS shadows.Ray.soOnline tool to create beautiful images of your code.CodepngConvert your source code into awesome shareable images.CSS Grid GeneratorA tool for creating CSS Grid LayoutsJSONTA simple and powerful online JSON formatting toolJitterOnline tool to create motion graphics/designVisilyTool that empowers non-designers to design web and mobile app mockupsokso.appThe drawing app with a nested "drawing-inside-the-drawing" structureCalc GeneratorTool for easily creating precise Calc() CSS functionsScrollbar.appSimple online editor for creating custom CSS scrollbarsGrapesJSOpen-source, multi-purpose, Web Builder Framework which combines different tools and features with the goal to help you (or users of your application) to build HTML templates without any knowledge of coding.FastTool DesignFree browser-based design utilities: color picker, palette generator, CSS gradient builder, contrast checker, hex/RGB/HSL converter, shadow generator. No signup, no upload.

Downloadable Design Software

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

Website DescriptionGimpFree & open source image editor similar to PhotoshopGravit DesignerFree full-featured vector graphic design app that works on ALL platformsBlenderOpen source, free animation, 3D modeling, etc.Raw TherapeeCross-platform raw image processing programBe FunkyOnline design programKritaSketching and painting program designed for digital artistsPencil ProjectGUI prototyping softwareInkscapePowerful free design toolAdobe XDFree design tool from AdobeShapes.soIcons that can be used as code in your projectsLunacySketch for WindowsInVision StudioFree screen designing tool from InVisionDarktableFree & Open source photography workflow application and raw developerInpixio photo EditorFree Photo Editor: For windows onlyColorpickerOpen Source colors software: Retrieve, manipulate and store your colors easily!Google Web DesignerCreate engaging, interactive HTML5-based designs and motion graphics that can run on any device.Origami StudioInteractive interface design tool created by Facebook: For mac only

Design Inspiration

Here are some websites to get inspiration for design and UI

Website DescriptionWebsiteviceA curated gallery of professional website designs to inspire developers and designers seeking creative ideas and best practices.CSS Zen GardenDemonstrating the power of CSS, over 200 CSS-only interpretations of the same HTML file.BehanceDesign projects featured by different creatorsDribbbleDesign projects featured by different creatorsLandingfolioLandingfolio features the best landing page inspiration, templates, resources and examples on the web.FoxyappsDesign inspiration from the best mobile app designsHttpsterShowcases websites made by people from all over the worldLand BookDisplays a large collection of websites to help find inspirationFrontend MentorReal-world UI Challenges using HTML, CSS and JavascriptAwwwardsA website that rate and collects the best websites in the world in UICodropsA website that collects the best UI ideas and patterns and make tutorials of itSaaS Landing PageDiscover the best landing page examples created by top-class SaaS companiesSaaspages.xyzA collection of the best landing pages with a focus on copywriting and design.ScreenlaneScreenlane is a website and newsletter that features the latest web and mobile design inspiration.lapa ninjaBest landing page inspirationFreefrontendFree frontend design from css html and javascript. latest work some design partWebframeDiscover and be inspired by beautiful webapp designsCollect UIDaily inspiration collected from daily ui archive and beyond. Handpicked, and updating daily.Graphic BurgerA 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 EmailsA site offering users a ton of company e-mails from customer service to marketing.Free Design ResourceA site offering fonts, mockups, templates graphics and ui kits.Site InspiresiteInspire is a showcase of the finest web and interactive design.Web Design InspirationA site for web design inspiration, updated daily.NavNavResponsive navigation examplesCalltoideaCollection of different web Components for inspiration.Mulzli SearchSearch engine for design inspirationDeviantArtAccess to 370 million pieces of art for inspiration.Design your wayCollection of different Web and Mobile DesignsSiteSeeA curated gallery of beautiful and modern websites.UI GarageDaily handpicked UI inspiration & patterns.ecomm.designeCommerce Website Design Gallery & Tech Inspiration.Design NomineesA showcase of awarding and showcasing the best websites, apps and Games.Design VaultA library of screenshots and patterns from real world digital productsCSS buttons84 Beautiful CSS buttons examples.CSS box-shadow91 Beautiful CSS box-shadow examples.Super DesignerDesign tools that give you super powers.LandingsFind the best landing pages for your design inspiration based on your preference.Page CollectivePage Collective is part of a network of design inspiration websites.CuratedUnleash your creativity with out-of-this-world web design inspiration from across the web.MaxibestofoneDaily feed of websites & fonts inspiration.Bento GridsBento Grids is a curated collection of tiles-based layouts that were popularized by Apple with their summary slides.Landing GalleryHome of the best landing page design inspiration.a-fresh.websiteHand—picked website and component inspiration library.bestwebdesigntoolsDiscover latest design tools, agencies and landing pages templates across webApp MotionExplore the best, hand-picked app motion designUiland DesignHome of the best mobile ui inspirations from top companies in the worldA1 GalleryHand-curated gallery of 1,000+ websites filterable by technology stack, font, style, colour, creator, type, and category

Image Compression

Websites that allow you to compress large images

Website DescriptionTinyPNGSmart PNG and JPEG compressionOptimizillaOnline JPEG and PNG optimizer / compressor with settings and archive downloadCompressor.ioJPEG, PNG, GIF, SVG CompressionSquoosh.appImage compression from Google Chrome LabsBulkResizePhotosBulk image resizing, compression & converting that perform all the tasks within the browser (It works offline)iLoveIMGThe fastest free web app for easy image modificationSvgOMGOnline SVG optimizer with a lot of settings and possibility to cut and paste svg code directly in it.CompressJPEGCompress JPEG images with size even greater than 5MBCompressNowJPEG, GIF, PNG CompressionPromo Image ResizerFree Image and Photo ResizerImage OptimizerImage Optimizer Free With Quality OptionsSVGminifyThis tool removes superfluous information, thereby reducing the size of your SVG filesJPEG OptimizerFree online tool for resizing and compressing digital photos and images for displaying on the webResizing.appResize Your Images OnlineEZGifAnimated GIF maker and Image editor including Image optimization and supports WebP conversionOnlinePngtoolsResize png for without losing transparent background.VerexifRemove meta tags in image in order to reduce image size and increase privacy securityVecta NanoUses lossless compression to compress inefficient SVG codes by removing unnecessary data. (Free & Paid)WatermarklyPrivate, client-side compression of JPEG images. The app does not send images to a server for processing.Jpeg.ioConvert any major image format into a highly optimized JPEGCompressImage.ioCompress JPG and PNG images. No Limits. Bulk Conversion. Convert to WebP. Works OfflineJPEG Compressorfree image compressor tool and it support JPEG, PNG, SVG, JPG, WEBP and GIF.Image Resize AIA 100% free & private (no upload) toolkit to resize, compress, crop, convert, and bulk image resizer. it support JPEG, PNG, SVG, JPG, WEBP and more.PNG CompressorA fast and simple PNG Compressor that reduces image file size without noticeable quality loss. Optimize PNGs instantly in your browser—no uploads, secure, and developer-friendly.

Chrome Extensions

Useful Chrome extensions for Designers and Web-Developers.

Website DescriptionWhatFontThe easiest way to identify fonts on web pages.WhatRunsDiscover what runs a website. Frameworks, Analytics Tools, Wordpress Plugins, Fonts - you name it.Web DeveloperAdds a toolbar button with various web developer tools.Awesome Screenshot & Screen RecorderFull page screen capture and screen recorder - 2 in 1. Share screencast video instantlydaily.dev - News for Busy DevelopersGet programming news with zero effort. Simply open a new tab, and you’re all set. A must-have tool for busy developers!JSONViewValidate and view JSON documents.JSON LiteBrowser extension for viewing JSON files.Window ResizerResize the browser window to emulate various screen resolutions.Responsive ViewerShow multiple screens once, Responsive design testerBrowserStackInstantly test your webpage on any desktop or mobile browser.VisBugOpen source web design debug tool built with JavaScriptKontrast - WCAG Contrast CheckerQuickly check and adjust contrast in real-time in your browser to meet WCAG 2.1 requirementsPerfectPixelAdds a semi-transparent image overlay over the top of the developed HTML to easily perform pixel perfect comparison between them, useful for replicating UI designs.PesticideInserts the Pesticide CSS into the current page, outlining each HTML element to better see placement on the page, helpful for building layouts.Site PaletteA must-have tool for designers and frontend developers to grab colors for any website.ColorZillaAdvanced Eyedropper, Color Picker, Gradient Generator and other colorful goodiesJavaScript and CSS Code BeautifierBeautify CSS, JavaScript and JSON code when you open a .css/.js/.json fileImageye - Image downloaderFind and download all images on a web page. With Imageye you can find, browse and download all the images present in a web page.GoFullPage - Full Page Screen CaptureCapture a screenshot of your current page in entirety and reliably—without requesting any extra permissions!StylebotChange the appearance of the web instantly.ColorPick EyedropperA zoomed eyedropper & color chooser tool that allows you to select color values from webpages and more.React Developer ToolReact debugging tools to the Chrome Developer Tools. It allows you to inspect the React component hierarchies in the Chrome Developer Tools.WappalyzerWappalyzer is a technology profiler that shows you what websites are built with.Fake FillerFake Filler a form filler that fills all inputs on a page with fake/dummy data.Page Ruler ReduxA Web Developer\Designer ruler to get perfect pixel dimensions and positioning to measure elements on any web page.Web EditorThe web editor is the tool that provides you with an enhanced way to inspect any website elements, alter their properties, insert contents, design, and visualize the way you want to see them.CSSViewerA simple CSS property viewer.Fonts NinjaIdentify fonts from any website, bookmark, try, and buy them.LighthouseAn open-source, automated tool for improving the performance, quality, and correctness of your web apps.Debug CSSAdds outline to all elements on the page to show the culprit element which is changing desired layout. Helps in debugging CSS of the pageUX CheckIdentify usability issues through a heuristic evaluation.Angular Developer ToolAngular DevTools allows you to understand the structure of your application and preview the state of the directive and the component instances.Redux Developer ToolRedux DevTools provides power-ups for your Redux development workflow. Apart from Redux, it can be used with any other architectures which handle the state.Hackertab.devHackertab helps developers stay up-to-date with the latest dev news and resources in one tab.JSON FormatterFormats and colors JSON content for better readability. It can also collapse and expand nested structures.SEO MinionA SEO tool that includes features like on-page SEO analysis, broken link checking, and SERP preview and more.

Firefox Extensions

Useful Firefox extensions for Designers and Web-Developers.

Website DescriptionWhatFontIdentify fonts on web pagesWhatRunsDiscover technologies used on websitesWeb DeveloperToolbar for web development tasksAwesome Screenshot & Screen RecorderCapture and annotate screenshotsdaily.dev - News for Busy DevelopersDeveloper news and resourcesJSONViewFormat and syntax highlight JSONWindow ResizerResize browser window to predefined dimensionsResponsive ViewerTest responsive design of websitesBrowserStackInstantly preview websites on different devicesVisBugWeb design debugging toolKontrast - WCAG Contrast CheckerCheck contrast levels for accessibilityPerfectPixelOverlay an image over a web page to comparePesticideOutline elements on web page for easy visualizationSite PaletteExtract color palette from websiteColorZillaAdvanced color picker and eyedropperLorem Ipsum Generator (Default Text)Generate lorem ipsum textJavaScript and CSS Code BeautifierBeautify and minify JavaScript and CSS codeImageye - Image downloaderDownload images from web pagesFireshot - Full Page Screen CaptureCapture full web pagesStylebotCustomize the appearance of web pagesColorPick EyedropperSimple color picker and eyedropperReact Developer ToolInspect React component hierarchyWappalyzerIdentify technologies used on websitesFake FillerFill out web forms with dummy data

AI Graphic Design Tools

AI tools that offer free service to generate design

Website DescriptionLeonardo.AiLeonardo AI is an AI-powered design tool that can help you create designs based on reference images.Galileo AIGalileo AI is a UI generation platform for easy and fast design ideation. It allows users to generate interface designs from text.ImgGen.AiImgGen AI is a free AI-powered image generator and enhancement tool.Unblurimage.AiUnblurimage AI is 100% Free,No Sign-Up online tool for unblur image.VMindVMind is an intelligent visualization suit that provides intelligent interfaces through rule algorithms, machine learning, and LLM.Free AI Diagram Generator a free AI-powered platform that helps you create various types of diagrams with ease.PolyGlyphAI-powered SVG generation and editing tool. Type a prompt to generate a vector graphic, then edit it in a browser-based vector editor. Free credits on signup.

Others

Uncategorized Stuff

Website DescriptionFigpeekFigpeek is a new Figma and GitHub thumbnail generator.Image ExtractorOnline tool for extracting all images and SVGs of a website, all you is just to drop the URLVertopalFree online platform for converting computer files to a variety of file formatseverysize.kibalabs.comCheck your awesome responsive webpage looks great in every sizeDevhints.ioThis is a modest collection of cheatsheets on InternetThe Web ToolboxA collection of handy, free-to-use tools for web developers, programmers and designers.WebDevTrickA famous blog for many amazing HTML, CSS, JQuery designs.css-tricksFree CSS tricks and some unique ideas for beginners and advancedMaterial Design ResourcesUse Material tools, downloads, and interactive projects to simplify your workflow.Nodesign.devA collection of tools for developers who have little to no artistic talentA11ygatorA web tool to scan websites against WCAG rulesCommitizenCommand line tool to formatted commit messages according to the standardsCleanCssTool For Code Formatter, Minifier, File ConverterTiny helpersA collection of free single-purpose online tools for web developersCSS Ribbon GeneratorThis generator will assist in creating a pure CSS corner ribbon.Can I UseCheck cross-browser compatibility of frontend technologies.kangax-js-compat-tableCheck JavaScript versions (ES5, ES6, ES2016+ etc.) compatibility across different compilers, servers/runtimes and platforms (Desktop and Mobile).mydevice.ioMost commonly used device resolutions including phones and tabletsCodepenBuild, test and discover frontend code.ResponsivelyA tool for designers and frontend developers to design and debug their in all platforms with easehtml2pdf.jsClient-side HTML-to-PDF rendering using pure JS.CSS ReferenceA collection of all css properties and definitions in detailCritical Path CSS GeneratorGenerate critical css for your web pagesSVG GobblerBrowser extension to find SVGs on a webpage and download, copy to clipboard, or export as PNG.shortcode.devA collection of useful snippets and code examples for HTML, CSS, JavaScript, Node, Artisan, Blade and more.30secondsofcode.orgA wide variety of snippet and article collections for CSS, JavaScript, Python and more.PlayCodeJavascript playground.All The TagsAll HTML tags briefly explained.Vue TelemetryReveal the Vue plugins and technology stack powering any website or explore a database of 5500+ websites.Grid.jsGrid.js is a Free and open-source HTML table plugin written in TypeScript. It works with most JavaScript frameworks, including React, Angular, Vue and VanillaJs.GerillassGerillass is a website development tool built on top of Sass with a set of Sass mixins and functions for frontend developers to generate scalable CSS outputs.SketchizeSketchize is built for UI/UX Designers to help them design lovely apps for mobile, tablet, and desktop devices.{CSS}PortalCSSPortal is home to a large range of CSS generators, tools and resources.DevDocsDevDocs combines multiple API documentations in a fast, organized, and searchable interface.papersizesThe best resource for International Paper Sizes, Dimensions & Formats.flexboxfroggyHelp Froggy and friends by writing CSS code!Designbetter BooksEssential reading on the practices that propel the best design teams forward.OverAPICollection Of All Cheat Sheets.PageclipA server for your Static HTML formsShieldsCreate badges with your own customization.williamsharkeyRandom SVG Graphic GeneratorBootstrap CheatSheetAn interactive list of Bootstrap classes, variables, and mixins. The only Bootstrap CheatSheet you will ever need.QR Code GeneratorUse QR Code Generator to easily create a QR code for your project.PapersDBThe Biggest Paper Database with Sizes, Dimensions and Formats in Metric and Imperial units.SETools.xyzFree Online tools website for workSmallDev.toolsFree tool for developers to help with Beautify & Minify HTML/CSS/Javascript, and many other handy tools. With a delightful interface.Angry ToolsFree web tools for speed up your development.Rapid APIDiscover and connect to thousands of APIs.Readme.soThe easisest way to create a README.ShowcodeBeautiful code screenshot generator.tldrawA tiny little drawing app.devices.cssPure CSS phones and tablets by Marvel App.TrooplBuild and publish a free portfolio in minutes.ApifoxApifox = Postman + Swagger + Mock + JMeterA Modern CSS ResetResets the css styling of all HTML elements to a consistent baseline across browsers.ClipperlyAll-in-one free online file service, convert, edit and optimize your files.DebugBear Speed TestTest and optimize page load speedCode BeautifyFree Online Tools like Code Beautifiers, Code Formatters, Editors, Viewers, Minifier, Validators, Converters for DevelopersVue CheatSheetAn interactive cheatsheet of Vue, Vue Router, and Pinia. The only Vue CheatSheet you will ever need.appydevA collection of awesome tools, resources and products for people who create and live on the internet.ExtendsClassFree online tools for developers, including image compressors/encoders, code formatters, code playgrounds, and many other handy utilities.RunJSFree online JavaScript playground.PillarstackAssorted resources for frontend developers and web designers.ToolsHref - Online Java code analyzer and JSON-to-Mermaid visualization tool. Multiple Dev ToolsToolbox Kit150+ free browser-based developer tools: JSON formatter, diff checker, regex tester, JWT decoder, CSS generators, SVG optimizer, color tools, and hash/QR generators. Runs client-side, no signup.

View on GitHub

On this page

Please read before submitting new resources.
Table of Contents
UI Graphics
Fonts
Colors
Icons
Logos
Favicons
Icon Fonts
Stock Photos
Stock Videos
Stock Music & Sound Effects
Vectors & Clip Art
Product & Image Mockups
HTML & CSS Templates
CSS Frameworks
CSS Methodologies
CSS Animations
Javascript Animation Libraries
Javascript Chart Libraries
UI Components & Kits
React UI Libraries
Vue UI Libraries
Angular UI Libraries
Svelte UI Libraries
React Native UI Libraries
Design Systems & Style Guides
Online Design Tools
Downloadable Design Software
Design Inspiration
Image Compression
Chrome Extensions
Firefox Extensions
AI Graphic Design Tools
Others

design-resources-for-developers

MIT★ 66,060

100

Health 100/100

Baseline50
Commit recency+25
Popularity+20
Open-issue load+5

awesome-list color-tools css design-resources developer-tools fonts icons illustrations stock-photos ui-kits

Raw .md

Embed badge

[![health](https://opensources.dev/resource/design-resources-for-developers/badge.svg)](https://opensources.dev/resource/design-resources-for-developers)

MITPermissive — free to use in commercial and proprietary software, with attribution.View license →

Production readiness

4/5

Actively maintainedCommits in the last 6 months
No known vulnerabilitiesNot yet scanned
Clear, usable licenseMIT (permissive)
Proven adoptionWidely used
Has documentationDocumentation indexed

MaintenanceActively maintainedIs design-resources-for-developers still maintained? →

Our analysis

When to use design-resources-for-developers

When not to

Strengths

Enormous breadth: 30+ categories spanning graphics, type, color, media, and code libraries
Hugely popular and trusted (66k+ stars), reflecting community vetting of the links
Well-organized table of contents with descriptions for each resource
Lowers the barrier for developers to produce decent-looking UIs without design expertise

Trade-offs

Pure link list — no code, no API, nothing to integrate
Inevitable link rot and stale entries as third-party sites change or disappear
Quality and licensing of linked resources vary; users must verify terms themselves
Contains sponsor/affiliate promotion (e.g. terminal sponsor banner) at the top
Overlaps heavily with many other 'awesome' design lists

Maturity

Documentation from design-resources-for-developers, shown under MIT with attribution. Source: https://github.com/bradtraversy/design-resources-for-developers

Warp, the intelligent terminal for developers Available for MacOS, Linux, & Windows

Please read `contributing guidelines` before submitting new resources.

UI Graphics
Fonts
Colors
Icons
Logos
Favicons
Icon Fonts
Stock Photos
Stock Videos
Stock Music & Sound Effects
Vectors & Clip Art
Product & Image Mockups
HTML & CSS Templates
CSS Frameworks
CSS Methodologies
CSS Animations
Javascript Animation Libraries
Javascript Chart Libraries
UI Components & Kits
React UI Libraries
Vue UI Libraries
Angular UI Libraries
Svelte UI Libraries
React Native UI Libraries
Design Systems & Style Guides
Online Design Tools
Downloadable Design Software
Design Inspiration
Image Compression
Chrome Extensions
Firefox Extensions
AI Graphic Design Tools
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

Icons

Resources for Icons including png, svg and more

Logos

Resources for Logos

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

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

CSS Methodologies

CSS methodologies to help write modular, reusable and scalable code

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

Javascript Chart Libraries

Libraries that help developers visualize data into charts

UI Components & Kits

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

React UI Libraries

UI and component libraries for the React JavaScript framework

Vue UI Libraries

UI and component libraries for the Vue JavaScript framework

Angular UI Libraries

UI and component libraries for the Angular JavaScript framework

Svelte UI Libraries

UI and component libraries for the Svelte JavaScript compiler

React Native UI Libraries

UI and component libraries for the React Native Framework

Design Systems & Style Guides

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

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

Image Compression

Websites that allow you to compress large images

Chrome Extensions

Useful Chrome extensions for Designers and Web-Developers.

Firefox Extensions

Useful Firefox extensions for Designers and Web-Developers.

AI Graphic Design Tools

AI tools that offer free service to generate design

Others

Uncategorized Stuff

View on GitHub

On this page

Please read before submitting new resources.
Table of Contents
UI Graphics
Fonts
Colors
Icons
Logos
Favicons
Icon Fonts
Stock Photos
Stock Videos
Stock Music & Sound Effects
Vectors & Clip Art
Product & Image Mockups
HTML & CSS Templates
CSS Frameworks
CSS Methodologies
CSS Animations
Javascript Animation Libraries
Javascript Chart Libraries
UI Components & Kits
React UI Libraries
Vue UI Libraries
Angular UI Libraries
Svelte UI Libraries
React Native UI Libraries
Design Systems & Style Guides
Online Design Tools
Downloadable Design Software
Design Inspiration
Image Compression
Chrome Extensions
Firefox Extensions
AI Graphic Design Tools
Others

Production readiness

Our analysis

When to use design-resources-for-developers

When not to

Strengths

Trade-offs

Maturity

Please read contributing guidelines before submitting new resources.

Table of Contents

UI Graphics

Fonts

Colors

Icons

Logos

Favicons

Icon Fonts

Stock Photos

Stock Videos

Stock Music & Sound Effects

Vectors & Clip Art

Product & Image Mockups

HTML & CSS Templates

CSS Frameworks

CSS Methodologies

CSS Animations

Javascript Animation Libraries

Javascript Chart Libraries

UI Components & Kits

React UI Libraries

Vue UI Libraries

Angular UI Libraries

Svelte UI Libraries

React Native UI Libraries

Design Systems & Style Guides

Online Design Tools

Downloadable Design Software

Design Inspiration

Image Compression

Chrome Extensions

Firefox Extensions

AI Graphic Design Tools

Others

Alternatives see all →

More in UI components

bootstrap

ui

material-ui

tailwindcss

ui-ux-pro-max-skill

storybook

Frequently asked questions

Production readiness

Our analysis

When to use design-resources-for-developers

When not to

Strengths

Trade-offs

Maturity

Please read contributing guidelines before submitting new resources.

Table of Contents

UI Graphics

Fonts

Colors

Icons

Logos

Favicons

Icon Fonts

Stock Photos

Stock Videos

Stock Music & Sound Effects

Vectors & Clip Art

Product & Image Mockups

HTML & CSS Templates

CSS Frameworks

CSS Methodologies

CSS Animations

Javascript Animation Libraries

Javascript Chart Libraries

UI Components & Kits

React UI Libraries

Please read `contributing guidelines` before submitting new resources.

Please read `contributing guidelines` before submitting new resources.