585 Websites met Gratis Design Content en Tools voor marketeers en ontwikkelaars

Gratis Design content voor marketeers, designers en ontwikkelaars

Deze lijst bevat 585 websites met gratis content en tools voor marketeers, designers en ontwikkelaars. Denk aan illustraties, foto’s, video, fonts en templates. Zo kan je sneller, hele mooie content maken! Let bij het gebruik van materialen altijd op de rechten. Sommige materialen zijn gratis voor privé gebruik, maar niet voor commercieel gebruik.

Veel plezier hiermee!

Deze lijst is gebaseerd op het GitHub repository Design Resources for developers.

Inhoudsopgave

Voor marketeers en designers

Voor developers

UI Graphics

Websites en content met moderne UI-componenten in verschillende formaten zoals PSD, Sketch, Figma, enz. Ze zijn geweldig voor ideeën voor webcomponenten / UI.

WebsiteDescription
UI Design DailyAwesome UI Components of all types
100 Daily UIFree Figma library of products, elements, and screens
Sketch App SourcesSketch UIs, wireframes, icons and much more
HumaaansCool illustrations of people with the ability to mix and match
PaaatternsFree collection of beautiful patterns for all vector formats
thepatternlibraryFree beautiful background patterns
404 illustrationfree illustrations for 404 pages
Drawkit.ioIllustrations for designers and startups
Undraw.coOpen-source illustrations for any idea you can imagine and create
Manypixels.coMonochromatic, Isometric high quality illustrations
Open PeepsHand drawn illustration library
UI SpaceThousands of great UI freebies
Animations.coBeautiful, customizable animated GIF icons
UplabsHigh-quality design resources (Free & Premium)
InvisionAppLibrary of free, high-quality UI kits, icon packs, and mockups
Open DoodlesA Free Set of Sketchy Illustrations
AvataaarsFree sketch library of avatars illustrations by Pablo Stanley
FreebieSketchFree Sketch designs, wireframes, illustrations, and more.
BlushFree customizable illustrations with Figma Plugin
Hero PatternsA collection of repeatable SVG background patterns
IRA DesignAn open-source gradient illustrations collection by creative tim.
Storytale.ioSubset of Storytale free quality illustrations
icons8.com/illustrationsFree vector illustrations to class up your project
PatternicoSeamless Pattern Maker
FreellustrationsFree Background Images for awesome landing Pages
Pixeltrue IllustrationsFree Animated Illustrations

↥ Back To Top

Fonts

Websites die gratis lettertypen en op lettertypen gebaseerde tools aanbieden.

WebsiteDescription
Google FontsLibrary of around 1000 free licensed font families
DaFontArchive of freely downloadable fonts
Use & ModifyPersonal selection of beautiful, classy, punk, professional, incomplete, weird typefaces
1001 Free FontsI think the name speaks for itself
Font SquirrelFont Squirrel scours the internet for high quality, legitimately free fonts
Font FabricA digital type foundry crafting retail fonts and custom typography for various brands
TiffA type diff tool that visually contrasts the differences between two fonts
TypeKit PracticeLearn about typography practices
FontjoyGenerate font pairing in one click
Golden RatioGolden Ratio Typography Calculator
FontSparkDiscover Better Fonts
FontPairHelps you pair Google Fonts together
Font SpaceA designer-centered free font website that has quick customizable previews
Abstract FontsFonts free for personal and commercial use
Free TypographyA list of high quality fonts
Leon SansA geometric sans-serif typeface made with code
LexendA variable font empirically shown to significantly improve reading-proficiency
Fonts for Apple PlatformsGet the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps
SFWinSan Francisco Fonts for Windows 10 and non-Apple Platform
Font FlipperPreview 800+ Google Fonts on top of your own designs, without having to download the fonts
Fonts ArenaFree curated fonts
BefontsHigh quality fonts for free
Arabic fontsArabic fonts for free
FontDropSimple and easy way to view the contents of font files
Open FoundryFREE platform for curated open-source typefaces
GlyphterUpload your own SVGS and turn them into font files. Usefull if you want a smaller library loaded
Google Webfonts HelperA Hassle-Free Way to Self-Host Google Fonts
Rough Font AwesomeWhen RoughJS meets Font Awesome

↥ Back To Top

Colors

Websites en bronnen die helpen bij keuzes maken op het gebied van kleurgebruik.

WebsiteDescription
Colormind.ioColor palette generator
ColorCurves.appColor palette generator that uses curves to generate color palettes
CoolorsCreate the perfect palette or get inspired by thousands of beautiful color schemes
HTML Color CodesGet HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names
Colors & FontsA curated library of colors, fonts and resources
Palette ListPick 2 colors you like and the tool generates thousands of palettes for you.
Google Material Color ToolOfficial Google Material Color Palette Tool
Material PaletteFree to pick palettes, icons and colors for Material Design
ColorSpaceGenerate nice color palettes from one color
FlatUIColorsBeautiful set of color palettes in various flavours
Adobe ColorCreate color palettes, extract gradients from images, etc
ColorsinspoAll-in-one resource for finding everything about colors
ColorsWallPlace to store your color palettes and generate palette in one click
HappyhuesHappy Hues is a color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects by Mackenzie Child
Adobe TrendsDiscover current color trends in different industries from the creative communities on Behance and Adobe Stock
Color HuntA free and open platform for color inspiration with thousands of trendy hand-picked color palettes
Gradient HuntA free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
Web GradientsA free website to find good css gradients
ColorBoxA free website to produce color set
CSS gradientA free website to make custome gradient and some examples of gradient
gradientaA pure css and jpg gradients
UI GradientsUI gradients color generator
Palette GeneratorGenerate new color palette with every spacebar press
Material Palettes1000+ Material Design palettes
GrabientGradient Selector
ShadeSwashQuickly generate shades of any color
BrandColorsThe biggest collection of official brand color codes
BRAND PALETTESLogo Color Codes and Palettes
Material Design Palette GeneratorGenerate theme and color palette Material Design-like
ColorateColor 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 colors
Gradient ButtonsReady to use copy/paste gradient buttons
KhromaKhroma 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 tester
Color Hex PickerTool to get hex code along with name of the color.
SaruwakakunThe stunning color scheme for website & App Designs with previews
PalettonPaletton.com is a designer color tool designed for creating color combinations that work together well.
ColorzillaA powerful online photoShop-like CSS gradient editor
Image Color PickerImage color picker and palette generator
CombineCOLORSColor mixing tool
Color Loversit will show the color schemes which are popular in 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 format

↥ Back To Top

Icons

Websites met iconen en pictogrammen, waaronder png, svg en meer.

WebsiteDescription
UXWingWell Optimized, Free icons for commercial use
Shapedfonts Iconclub8000+ free icons
Feather IconsBeautiful, customizable open source icons
Tabler Icons470+ highly customizable open source SVG icons
Simple Icons1307 Free SVG icons for popular brands
Instant Logo Searchthousands of free brands logos ( SVG – PNG )
Linear Icons1000+ Ultra crisp vector icons
Icons8Free icons, photos, vectors and tools
Flat IconThe largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
The Noun ProjectOver 2 Million curated icons, created by a global community
IconscoutFree Download Icons illustrations stock photos at one place
Nucleo 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 SVG
Bootstrap IconsFree Icons built for Bootstrap but they’ll work in any project
Remix IconSimply Delightful Icon System
IconmonstrDiscover 4496+ free icons in 313 collections
Vivid.jsReady to use Free and Open Source SVG Icons Pack JavaScript Library.
IconfinderFree and premium vector icons in SVG, PNG, CSH and AI format
Lordicon50 free animated interactive icons
UseAnimationsFree 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 & API
SVGPorn1000+ high-quality SVG logos
Payment System LogosLogos for payment systems available in png and svg
Browser LogosHigh resolution web browser logos
IconBros7843+ free icons grouped in 182 collections
LogoHubGenerate and download your logo for free in PNG and SVG format
Material Design IconsA 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 customisable & accessible vector icons
appiconQuickly generate app icons in diffrent sizes for your IOS, macOS and Android projects
LineIcons2000+ Essential Line Icons for Designers and Developers
EvericonsEvericons 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” icons
Unified iconsThousands of icons, one unified framework. One library, over 40,000 vector icons.

↥ Back To Top

Favicons

Websites die helpen met het maken van Favicons.

WebsiteDescription
Favicon.ioGenerate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
FavicomaticGenerate favicons of all the sizes and formats as well as the HTML code needed to support every possible browser or device
Favicon GeneratorGenerate favicon ico files for your website
RealFaviconGeneratorGenerate icons for all platforms (Windows, iOS, Android)
FontIconGenerate favicons and images from Font Awesome icons

↥ Back To Top

Icon Fonts

Websites die Icon Fonts aanbieden.

WebsiteDescription
Font AwesomeThe web’s most popular icon set and toolkit
Line AwesomeSwap in replacement of Font Awesome with modern line icons
Material IconsMaterial design icon library
IonIconsBeautifully crafted open source icons from Ionic team
Zurb Foundation IconsCustomizable Foundation icons
Fontisto IconsFontisto the iconic font and css toolkit · 616+ free icons
BoxiconsBoxicons is a free collection of carefully crafted open source icons
Icofont2100+ free icons to spice up your creative designs
Material PaletteFree to pick palettes, icons and colors for Material Design]
Material Design Iconic FontMaterial design icon font
Vscode CodiconsThe icon font from Visual Studio Code
DeviconDevicon is a set of icons representing programming languages, designing & development tools
PaymentFontA sleek webfont for payment operators and methods. Featuring 116 icons
Weather IconsWeather Icons is the only icon font with 222 weather themed icons
Stroke 7202 thin stroke icons inspired by iOS 7
Jam Icons890+ handcrafted icons to make your web app awesome
Fontastic.meCreate your custom icon fonts in seconds. Over 9,000 icons available to pick from or upload your custom svg
Fontello200+ web icons where you can customize the names or codes of icons.
LineaLinea: Featuring 750+ Free Icons

↥ Back To Top

Stock Photos

Websites die allerlei gratis stockfoto’s aanbieden voor websites en apps.

WebsiteDescription
PexelsFree stock photos shared by talented creators
UnsplashThe internet’s source of freely usable images
PixabayOver 1.7 million+ high quality stock images and videos
MagdeleineGallery & free high res photo everyday
PicspreeRoyalty free images, stock photos, illustrations, and vectors
BurstFree stock photos collections
GratisographyFree collection of free high-resolution pictures
Life of PixFree high resolution photography
Stock SnapHundreds of high quality photos added weekly
MorguefileOver 350,000 free stock photos for commercial use
Kaboom PicsStock photography and color palettes. Good for product images
New Old StockStock vintage photos
Pic JumboGood collections of different types of photos
Public Domain PicturesPublic domain images of all types
Find A PhotoSearches multiple stock photo websites
StockvaultCategorized stock photos
PlaceholderA free image placeholder service for the web. You can specify image size and format
Realistic ShotsFree high resolution stock photos
Negative SpaceHigh-Resolution Free Stock Photos
SkitterPhotoFree high resolution photography
PicoGraphyGorgeous, High-Resolution, Free Photos
Wunder StockStunningly amazing free photos
PxHereFree Images & Free stock photos – PxHere
PiqselsRoyalty Free Stock Photos
FoodiesFeedFood photo stock
NappyA website offering Beautiful, high-res photos of black and brown people.
Generated PhotosUnique AI Generated model photos
ReshotUniquely free photos. Handpicked, non-stocky images.
Free ImagesFind and download free stock photos – all free for personal and commercial use
Lorem 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 images
Integration & 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 images

↥ Back To Top

Stock Videos

Websites die allerlei gratis stockvideo’s aanbieden voor websites en apps.

WebsiteDescription
PexelsLargest library of free to use videos, donated by the community
PixabayLarge library of free to use videos, donated by the community similar to Pexels
Coverr.coBeautiful free stock video footage
VideezyFree HD stock footage & 4K videos
Mix KitStock video clips & music
Life Of VidsFree video clips and loops
VidevoFree and premium stock videos
LoopvidzFree To Use Cinemagraphs Created With VIMAGE App

↥ Back To Top

Stock Music & Sound Effects

Websites die allerlei gratis stockmuziek en audio effecten aanbieden voor websites en apps.

WebsiteDescription
Free Stock MusicRoyalty free stock music for YouTube videos, podcasts, etc
BensoundDownload Royalty Free Music for free and use it in your project
MixkitFree music for your projects
FreesoundFree stock music and sounds
Free Music ArchiveCollaborative database of creative-commons licensed sound for musicians and sound lovers
MusopenAn online copyright free classical music library
UnminusFree Premium Music for Your Projects 🎁 Royalty Free. Cleared for YouTube.

↥ Back To Top

Vectors & Clip Art

Gratis vectoren, clipart, illustraties, patronen en meer.

WebsiteDescription
VecteezyFind and download free vector art
FreepikFree vectors, stock photos, PSD and icons
Free VectorsCommunity of vector lovers who share free vector graphics
PNGTreepng, backgrounds, templates, text effects
Vector4FreeFree vector graphics
Retro VectorsVintage vectors and graphics
FreebleVectors, patterns, mockups and more
LukaszadamFree Vector atrworks
IlllustrationsBeautiful 100 Illustrations – png, svg
ClipartChoose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
Growwwkit illustrationsA set of 8 simple, black & white, stylish illustrations
World Vector LogoDownload vector logos of brands you love
trianglify.ioGenerate low-poly backgrounds, textures, and vectors
blobGenerate Blob shapes for Web and Flutter apps
HiClipartA community for designers to share & download transparent background PNG cliparts
Stories by FreepikA collection of free and customizable illustrations for projects
Black IllustrationsBeautiful illustrations of black people (free and premium)
DelesignA collection of free illustrations and more
Custom Shape DividersFree tool to make it easier for designers and developers to export a beautiful SVG shape divider
Servier Medical Art3000 free medical images to illustrate your publications and Powerpoint presentations
ClkerFree clip art you can use for anything you like

↥ Back To Top

Product & Image Mockups

Maak mockups van apparaten en andere producten.

WebsiteDescription
Smart MockupsCreate stunning product mockups (free & premium)
Shot SnapCreate beautiful device mockup images for your app or website design
ScreelyInstantly turn your screenshot into a mockup
Screenshot.rocksCreate beautiful browser & mobile mockups in seconds
Screen PeakCreate a mockup from a URL
Mockup WorldThe biggest source of free photo-realistic Mockups online
Collab ShotReal-time screen grabs and image sharing
Facebook DevicesImages and Sketch files of popular devices
Threed.ioGenerate 3D mockups right in your browser.
Mockuphone100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TV
Device ShotsCreate high-resolution device mockups for social media, for free

↥ Back To Top

HTML & CSS Templates

Websites die gratis prachtige websitesjablonen en allerlei soorten thema’s bieden.

WebsiteDescription
HTML5UpVery modern, unique responsive HTML5/CSS3 themes
TemplatemoMinimal, resume, gallery themes and more
Templated.coTons of minimalistic HTML5/CSS3 themes
FreeHTML5Free & premium HTML5 and Bootstrap themes
StyleShoutBrilliantly crafted free website templates
Start BootstrapBootstrap starter themes
ZerothemeHTML5, Bootstrap, Prestashop templates
HTML5xCSS3Collection of wonderful templates in different categories
ColorlibAlmost any category of theme you can think of
Free CSSHuge collection of free templates
HubspotTemplates, infographics, banners and much more
MobiriseGreat looking HTML5/CSS3 templates
BootswatchFree themes for Bootstrap
OnepageloveOne page websites, templates and resources
Themes For AppFree Bootstrap themes and landing pages
BootstrapTastePremium & Free Bootstrap Templates
BootstrapMadeElegant, clean and beautiful free templates using Bootstrap.
W3LayoutsW3Layouts: 3784+ Free Website Templates for 2020
TooplateTooplate: Free HTML Templates for everyone!
CruipFully coded HTML templates to help you easily build your startup landing page without hassles.
ShadeGet High Converting Landing Pages For Free!
UIdeckFree Landing Page Templates and Bootstrap Themes
SplawrFree web templates to kickstart your idea!

↥ Back To Top

CSS Frameworks

CSS/UI-frameworks om goed uitziende websites en applicaties te bouwen.

WebsiteDescription
Tailwind CSSLow level, utility-first framework
BootstrapPopular UI framework with tons of components that use both CSS and JS
MaterializeA modern responsive front-end framework based on Material Design
Material Design LiteLight framework based on Material Design. No JS dependency
BulmaModern CSS framework with no JS
SkeletonExtremely light framework for basic UI elements
Semantic UIEmpowers designers and developers by creating a shared vocabulary for UI
Fomantic UIA community fork of Semantic-UI
FoundationMobile first framework with clean markup
Pure CSSA set of small, responsive CSS modules
UIKitLightweight and modular front-end framework
SusyLightweight, grid-layout engine for Sass
Milligram.ioMinimalist CSS framework
Vanilla FrameworkSimple, extensible CSS framework written in Sass
Spectre CSSLightweight, modern CSS framework
Picnic CSSLightweight and beautiful library
WingA beautiful CSS framework designed for minimalists
ChotaA micro (~3kb) CSS framework
Blueprint CSSA lightweight layout library for building great responsive mobile first UIs that work everywhere
W3.CSSA modern CSS framework with support for desktop, tablet, and mobile design by default. Designed to be independent of jQuery or any other JavaScript library
98.cssA design system for building faithful recreations of old UIs
NES CSSNES-style CSS Framework
Shoelace.cssLightweight, forward-thinking CSS library built with future CSS syntax
MVP.cssA minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you’re done
Blaze.cssOpen source modular CSS toolkit providing great structure for building websites quickly
Turret CSSTurret CSS is a styles framework for development of responsive websites.
CutestrapA strong, independent CSS Framework.
ShorthandShorthand is a free and open source css framework, that allows you to make unique and modern design without writing any css
XP.cssXP.css is an extention 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 Library
mini.cssminimal, responsive, style-agnostic CSS framework
TachyonsCreate fast loading, highly readable, and 100% responsive interfaces with as little css as possible.
Material BootstrapMaterial Design with Bootstrap
IvoryA modern CSS framework for developing powerful web interfaces faster and easier
Halfmoon 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.

↥ Back To Top

CSS Animations

CSS-animaties om geweldige animaties voor websites en applicaties te bouwen.

WebsiteDescription
Animate.cssJust-add-water CSS animations
Bounce.jsBounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations
Anime.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 Objects
Magic AnimationsAnimations has been one of the most impressive animation libraries available
ZdogRound, flat, designer-friendly pseudo-3D engine for canvas & SVG
CSShakeCSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web page
Hover.cssHover.css is a CSS animation library designed for use with buttons and other UI elements in your website
AniJSAniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structure
AnimistaCSS Animations On Demand
Tachyons-animateTachyons itself is an atomic CSS library with a ton of utility classes for essentially designing anything by adding classes to what you need
Sequence.jsSequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications
InfiniteThese animations, like rotations and pulses, that are specifically designed to run and repeat forever
OBNOXIOUS.CSSAnimations for the strong of heart, and weak of mind
MOTION UIA Sass library for creating flexible CSS transitions and animations
Keyframes.appA graphical user interface for generating custom CSS keyframe animations

↥ Back To Top

Javascript Animation Libraries

Javascript-animatiebibliotheken om geweldige animaties voor websites en applicaties te bouwen.

WebsiteDescription
GreensockA JavaScript library for building high-performance animations that work in every major browser
Velocity.jsVelocity is an 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 library
three.jsAn easy to use, lightweight, 3D library with a default WebGL renderer.
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 page
tsParticlesA lightweight library for creating particles, an improved version of the abandoned and obsolete particles.js
Particles.jsA lightweight JavaScript library for creating particles
mo.jsThe motion graphics toolbelt for the web
Lightbox2A small JS library to overlay images on top of the current page.
SlickFully responsive carousel

↥ Back To Top

UI Components & Kits

Niet echt “frameworks”, maar tools voor het creëren van gebruikersinterfaces met componenten of UI-kits.

WebsiteDescription
TagFoldUseful Bootstrap 4, HTML5, CSS3 Code Snippets to Build Web Layouts
UILangA minimal, ui-focused programming language for web designers
Medialoot CSS ComponentsCalendars, price grids and other UI components
Froala Design BlocksOver 170 responsive design blocks ready to be used in your web or mobile apps
Mui 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 Bootstrap
PhotonkitDesktop UI library for Electron
Flat UIMinimal free user interface kit
ShardsA free and modern UI toolkit for web makers based on Bootstrap
Creative TimAll types of UI libraries and kits including JS frameworks like React
Brumm Shadow MakerAn online tool to make css shadows
AdminLTEBest open source admin dashboard & control panel theme
SpinKitSimple CSS Spinners
Epic SpinnersCSS spinners collection with Vue.js integration.
Loading.ioOnline service provider for creating simple animations, spinners, progress bar and more
Moving LettersAnimated Text with JavaScript and anime.js
CSS LayoutA collection of popular web layouts and patterns in pure CSS
CSS Grid GeneratorAn open-source project that allow users to quickly create dynamic layout based on CSS Grid.
CodyhouseKick-start your web projects with CodyHouse’s front-end framework and library of accessible HTML, CSS, JavaScript components
Tailwind Starter KitTailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open Source
TailwindtoolboxOpen 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 TailwindCSS
sweetalertSweetAlert makes popup messages easy and pretty.
sweetalert2A beautiful,responsive,customizable,accessible replacement for javascript’s popup boxes
tailblocksOpen source ready-to-use Tailwind CSS components.
Soft ComponentsA set of framework-agnostic web components based on neumorphic design.
FastAn interface system that can be used with modern Web Frameworks such as React, Vue and Angular.
LottieFilesInteractive animations in many formats like json,gif and mp4, libraries and plugins for Web & Mobile .

↥ Back To Top

React UI

UI en componentbibliotheken voor het React JavaScript-framework.

WebsiteDescription
Material UIReact components for faster and easier web development, based on Material Design
Chakra UIBuild accessible React apps & websites with speed. Openchakra
React BootstrapBootstrap rebuilt for React. Include Bootstrap components right in your JavaScript
ui-playbookThe documented collection of UI components
ReactStrapAnother Bootstrap UI library for React
React AdminA frontend Framework for building admin applications. Supports API’s out of the box
BlueprintJSReact-based UI toolkit for the web
React Semantic UIUI components based off of the Semantic UI framework
Shards ReactReact UI kit featuring a modern design system with dozens of custom components
React VirtualizedUI set for data. Includes tables, lists, sorting, etc.
React ToolboxMaterial design UI library for React
Elastic UIDistributes UI React components and static assets for use in building web layouts
React DesktopDesktop styled components in React. Includes MacOS and Windows based components
Theme UIBuild consistent, themeable React apps based on constraint-based design principles
Onsen ReactDistributes Components for hybrid mobile apps with React and Onsen UI
EvergreenDesign system for React
RebassReact primitive UI components built with styled system
Grommetmobile first UI component library
RimbleReact design kit, library and guides
Landing Page TemplateOpen source landing page template for react
Elemental UIA UI Toolkit for React.js Websites and Apps
Ant 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 Components
Primer ComponentsPrimer Components are React components which implement GitHub’s Primer Design System
OrbitDesign system and React UI components for travel projects.
Base WebBase Web provides a robust suite of components out of the box
Backpack UIBackpack is the Lonely Planet toolset that we use to build front end apps.
ReavizData visualization library for React based on D3
React 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 library
Framer MotionA React library to power production-ready animations.
React SpectrumA React implementation of Spectrum, Adobe’s design system.
React tsParticlesA lightweight React component for creating particles
particles-bgA React particles animation background component

↥ Back To Top

Vue UI

UI en componentbibliotheken voor het Vue JavaScript-framework.

WebsiteDescription
VuetifyMaterial design component framework
Bootstrap VueUse Bootstrap components with Vue
BuefyLightweight UI components based on Bulma
Semantic UI VueSemantic UI Vue is the Vue integration for Semantic UI
QuasarHigh-performance Material Design component suite with builders for SPA, SSR, PWA, Mobile (Cordova & Capacitor), Desktop (Electron) and Browser extensions
ElementDesktop UI library for Vue
Fish UIVue UI toolkit for the web
Keen UIVueUI library with a simple API, inspired by Google’s Material Design
Onsen VueDistributes Components for hybrid mobile apps with Vue and Onsen UI
VuejsexamplesA nice collection of useful vuejs UI components
InklineInkline is a modern UI/UX Framework for Vue.js designed for creating flawless responsive web applications
VuesaxUnique and reusable UI components
AntdvUI library for Vue based on Ant Design
Shards VueA high-quality & free Vue UI kit featuring a modern design system with dozens of custom components
Prime 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.
Particles.vueA lightweight Vue component for creating particles

↥ Back To Top

Angular UI

UI en componentbibliotheken voor het Angular JavaScript-framework.

WebsiteDescription
Material AngularUI library for Angular based on Material design
NG BootstrapUI library for Angular based on the Bootstrap framework
PrimeNGPowerful UI component library for Angular
Onsen AngularHybrid mobile and PWA UI library for Angular and Onsen UI
NG LightningNative Angular components & directives for Lightning Design System
NG SemanticUI library for Angular based on Semantic UI
NebularCustomizable UI Kit, Auth & Security for Angular
Alyle UIMinimal components set for Angular
NGX BootstrapAnother UI library for Angular based on the Bootstrap framework
NG ZorroUI library for Angular based on Ant Design
Pagination for datatablesnpm library for pagination
Multi select dropdownfor multi select dropdowm in forms
NG ParticlesA lightweight Angular component for creating particles

↥ Back To Top

Svelte UI

UI en componentbibliotheken voor de Svelte Javascript-compiler.

WebsiteDescription
Svelte Material UIUI library for Svelte based on Material Design
SvelteStrapUI library for Svelte based on the Bootstrap framework
Svelte Flat UIUI library for Svelte based on Flat Design
Svelte ParticlesA lightweight Svelte component for creating particles

↥ Back To Top

Design Systems & Style Guides

Ontwerpsystemen, stijlgidsen, toolkits, docs. Sommige hiervan zijn ontwerpgidsen voor topbedrijven & -websites.

WebsiteDescription
Material DesignGoogle’s Material Design
Ant DesignDesign system for enterprise-level products
Apple Design ResourcesGuides and templates for using Apple design and UI
PrimerDesign, build, and create with GitHub’s design system
Alta UIOracle’s design system and toolkit
PulseDesign system, guides and React component library
BoltRobust Twig and web component powered UI components
Clarity Design SystemUX guidelines, HTML/CSS framework, and Angular components
AtlasKitAtlassian’s official UI library, built according to the Atlassian Design Guidelines
Audi Design ResourcesAudi UI design system and toolkit
Carbon Design SystemsCarbon is IBM’s open-source design system for products and experiences
Yelp Style GuideYelp style guide, components and toolkit
CometScalable design system of visual language, components, and design assets
ETrade Design SystemGuides and toolkits that blend finance with simplicity and ease of use
Fundamental LibraryOpen source and community driven project for consistent user interfaces
Infor DesignGuidelines and resources to create meaningful experiences for Infor’s products
LexiconAn experience language for crafting beautiful UI
Mailchimp UI/UXStyle guide and components from Mailchimp
Marvel Style GuideSet of design principles and components
Microsoft Fluent UICollection of UX frameworks from Microsoft
Pluralsight Design SystemDesign guide with components for designing with Pluralsight
PolarisDesign system that creates great experiences for all of Shopify’s merchants
Mozilla ProtocolProtocol is a design system for Mozilla and Firefox websites
SendGrid Style GuideUI library for developing consistent UI/UX at SendGrid
VTEX StyleguideReusable patterns, components and assets related to product design in VTEX
RizzoStyle guide with UI components, JS components, widgets, etc
AtomizeUI framework that helps developers collaborate with designers and build consistent user interfaces effortlessly
StyleGuides.ioA directory of 500+ styleguides
Done Design SystemOpen source design system, guides & components
Skoda Brand SystemDesign guideline for developing applications under the Skoda brand
SpectrumAdobe’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.

↥ Back To Top

Online Design Tools

Allerlei online tools voor ontwerp, van foto-editors tot wireframing, en meer.

WebsiteDescription
FigmaOnline graphic design tool (Free & paid options)
VectrFree vector graphics software
TalerCreate social media banner designs in minutes from hundreds of customizable templates
CanvaCreate beautiful designs (Free & Paid)
Get WavesA free SVG wave generator to make unique SVG waves for web design
ClippyEasy CSS clip-path maker
Fancy Border RadiusEight values specifying border-radius in CSS ( border-radius generator )
Wireframe.ccWireframing tool (free & paid)
FotorPhoto editor and design maker
PixlrOnline photo editor
Animoto Video MakerMake videos online
RemoveBGRemove image backgrounds
Photo CreatorCreate your own photos instead of searching for stock
VismeCreate presentations, infographics and more
InfogramCreate infograms
ChartGoCreate charts and graphs online
Cartoon PhotoTurn photos into cartoons
Logo MakerCreate custom logos
WhimsicalWireframes, diagrams and more (4 free)
WhiteboardOnline drawing tool
OctopusSitemap builder
CTA Button MakerCreate call to action buttons
BlobmakerBlobmaker 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 age
SoftUIA Soft UI (neumorphism) CSS generator
PhotopeaA Online Photoshop editor
ExcalidrawVirtual whiteboard for sketching hand-drawn like diagrams
DiagramsDiagram software and Flowchart maker
MapInSecondsSimple way to visualize your data with a map
Grid MalvenA css grid cheatsheet to reference when creating a css grid
Flex MalvenA flexbox grid cheatsheet to reference when working with flexbox
Smart UpscalerUpscale images by 2-4x resolution
GetAvataaarsFun and Colorful free avatars web generator tool by Fang-Pen Lin using Pablo Stanley sketch library
Big 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 photos
Neumorphism.ioGenerate Soft-UI CSS shadow code
DB DesignerDesign your database for free online
Ui BakeryCreate full-fledged web apps visually
FauxTurn real code into faux code
RiveReal-time interactive design tool that allows you to design, animate, and immediately integrate your assets into any platform.
UnscreenRemove Video Background 100% Automatically and Free
KodeshotConvert your source code into nice pictures for your articles, tweets, messages, posts…
WixCreate a Website You’re Proud Of
GTmetrixWebsite Speed and Performance Optimization
FramerIs prototyping tool for teams
Draw.ioFree online diagram editor tool

↥ Back To Top

Downloadable Design Software

Gratis software voor UI, foto, 3D-modellering, etc. Alternatieven voor betaalde software zoals Photoshop.

WebsiteDescription
GimpFree & open source image editor similar to Photoshop
Gravit DesignerFree full-featured vector graphic design app that works on ALL platforms
BlenderOpen source, free animation, 3D modeling, etc.
Raw TherapeeCross-platform raw image processing program
Be FunkyOnline design program
KritaSketching and painting program designed for digital artists
Pencil ProjectGUI prototyping software
InkscapePowerful free design tool
Adobe XDFree design tool from Adobe
Shapes.soIcons that can be used as code in your projects
LunacySketch for Windows
InVision StudioFree screen designing tool from InVision
DarktableFree & Open source photography workflow application and raw developer
Inpixio photo EditorFree Photo Editor: For windows only
ColorpickerOpen Source colors software: Retrieve, manipulate and store your colors easely!

↥ Back To Top

Design Inspiration

Hier zijn enkele websites om inspiratie op te doen voor ontwerp en gebruikersinterface.

WebsiteDescription
BehanceDesign projects featured by different creators
DribbbleDesign projects featured by different creators
HttpsterShowcases websites made by people from all over the world
Microcopy InspirationsCurated collection of UX writing examples, microcopy examples and copywriting examples
InspofindsLatest design work from designers and the design community
Design NotesFree online resource library for product designers
Land BookDisplays a large collection of websites to help find inspiration
Frontend MentorReal-world UI Challenges using HTML, CSS and Javascript
AwwwardsA website that rate and collects the best websites in the world in UI
CodropsA website that collects the best UI ideas and patterns and make tutorials of it
SaaS Landing PageDiscover the best landing page examples created by top-class SaaS companies
Pages.xyzCurate and discover the best designed web pages
UI MovementUI Movement is a community of design enthusiasts who share and discuss the most interesting and unique UI designs
lapa ninjaBest landing page inspiration
FreefrontendFree front end design from css html and javascript. latest work some design part
WebframeDiscover and be inspired by beautiful webapp designs
Collect UIDaily inspiration collected from daily ui archive and beyond. Hand picked, 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 examples
CalltoideaCollection of different web Components for inspiration.
MediaQueri.esA collection of inspirational websites using media queries and responsive web design
Mulzli SearchSearch engine for design inspiration
DeviantArtAccess to 370 million pieces of art for inspiration.

↥ Back To Top

Image Compression

Websites om grote afbeeldingen te comprimeren.

WebsiteDescription
TinyPNGSmart PNG and JPEG compression
OptimizillaOnline JPEG and PNG optimizer / compressor with settings and archive download
Compressor.ioJPEG, PNG, GIF, SVG Compression
Squoosh.appImage compression from Google Chrome Labs
BulkResizePhotosBulk image resizing, compression & converting that perform all the tasks within the browser (It works offline)
iLoveIMGThe fastest free web app for easy image modification
SvgOMGOnline 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 5MB
CompressNowJPEG, GIF, PNG Compression
Promo Image ResizerFree Image and Photo Resizer
Image OptimizerImage Optimizer Free With Quality Options
SVGminifyThis tool removes superfluous information, thereby reducing the size of your SVG files
JPEG OptimizerFree online tool for resizing and compressing digital photos and images for displaying on the web
Resizing.appResize Your Images Online
EZGifAnimated GIF maker and Image editor including Image optimization and supports WebP conversion
OnlinePngtoolsResize png for without losing transparent background.

↥ Back To Top

Chrome Extensions

Nuttige Chrome extensies voor Marketeers, Designers en Developers.

WebsiteDescription
WhatFontThe 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 instantly
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 tester
BrowserStackInstantly test your webpage on any desktop or mobile browser.
VisBugOpen source web design debug tool built with JavaScript
KeyframesIn-browser CSS Animation creator.
Kontrast – WCAG Contrast CheckerQuickly check and adjust contrast in realtime in your browser to meet WCAG 2.1 requirements
PerfectPixelAdds 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.

↥ Back To Top

Uncategorized Stuff

Others

WebsiteDescription
everysize.kibalabs.comCheck your awesome responsive webpage looks great in every size
Devhints.ioThis is a modest collection of cheatsheets on Internet
The 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 advanced
Material Design ResizerAn interactive viewer that helps designers test material design breakpoints across desktop, mobile, and tablet
Nodesign.devA collection of tools for developers who have little to no artistic talent
A11ygatorA web tool to scan websites against WCAG rules
CommitizenCommand line tool to formatted commit messages according to the standards
CleanCssTool For Code Foramtter, Minifier, File Converter
Tiny helpersA collection of free single-purpose online tools for web developers
CSS 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 tablets
CodepenBuild, test and discover frontend code.
ResponsivelyA tool for designers and frontend developers to design and debug their in all platforms with ease
html2pdf.jsClient-side HTML-to-PDF rendering using pure JS.
CSS ReferenceA collection of all css properties and definitions in detail
Critical Path CSS GeneratorGenerate critical css for your web pages
SVG 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.
PlayCodeJavascript playground.
All The TagsAll HTML tags briefly explained.

↥ Back To Top