Begin met één kleur en genereer complementaire, analoge, triadische en meer harmonieën — exporteer daarna als CSS, Tailwind v4, SVG of PNG.
Gids kleurtheorie
De cirkel rangschikt tinten in een rondje zodat relaties ruimtelijk worden. Afstand betekent contrast, nabijheid betekent rust. Alles hieronder is interactief — verander de cirkel en deze ideeën landen sneller.
Tip: deel elk resultaat — de URL bewaart altijd je basis, harmonie en helderheid.
Eén tint is nooit genoeg voor interfaces. Meng met zwart voor schaduwen (koppen, hovers), met wit voor tinten (achtergronden, modals) en met grijs voor tonen (gedempte tekst, randen).
Indigo van schaduw naar tint. Dezelfde logica stuurt elk palet hierboven.
In de klassieke RYB-cirkel zijn rood, geel en blauw primair; gemengd leveren ze oranje, groen en paars. Op scherm mengen we licht (RGB), dus rekent deze tool in HSL/HSV — dezelfde cirkel, afgestemd op pixels.
Twelve stops around the disc; every other color contains a trace of a primary.
Ease Colors is een gratis kleurenwiel online voor ontwerpers en ontwikkelaars die betrouwbare kleur nodig hebben zonder de browser te verlaten. Kies een basiskleur op de interactieve kleurenwielkiezer, bekijk zes harmonieën tegelijk en kopieer productiekare HEX-, RGB-, HSL- of OKLCH-codes. Niets wordt geüpload, geen account nodig, en elk resultaat krijgt een deelbare URL die je exacte basiskleur, harmonie en helderheid herstelt. Een ingebouwde tintenbalk rekt elke basiskleur van licht naar donker, en de hele pagina blijft toetsenbordbedienbaar — met zichtbare focus bij elke stap.
Het kleurenwiel is een cirkelvormig kleurdiagram waarin tinten zo zijn gerangschikt dat relaties ruimtelijk worden: buurkleuren kalmeren, tegenkleuren creëren spanning. De klassieke primaire kleurencirkel uit de tekenles mengt rode, gele en blauwe verf, terwijl het RGB-kleurenwiel op je scherm licht mengt. Deze tool berekent elke harmonie in de HSV/HSL-kleurruimte — afgestemd op pixels in plaats van pigment. Sleep een stip over de schijf voor de tint, naar de rand voor verzadiging, en draai aan de buitenste helderheidsring om één tint van lichte achtergrond naar donkere tekst te dragen. Omdat de schijf altijd op volle levendigheid wordt getekend, blijven de markers verspreid en sleepbaar — zelfs bij bijna zwarte of bijna witte paletten stort de geometrie aan de uitersten nooit in.
Dit kleurenwiel online is tegelijk een volwaardige online kleurkiezer en kleurtool:
Richtingen aan het verkennen? Druk op Shuffle in de kleurenpaletgalerij voor een willekeurige trekking uit 400+ samengestelde sets.
Simuleer vóór publicatie kleurenblindheid — protanopie, deuteranopie, tritanopie en achromatopsie — en houd tekst leesbaar dankzij contrastgekozen staallabels op elke strook.
Elke kleurkiezer op deze pagina spreekt vier formaten. Het HEX-veld accepteert elke hex-kleurcode zoals #EDEA37, de RGB-kiezer leest tripletten zoals rgb(99, 102, 241), en HSL plus OKLCH dekken de perceptuele gelijkmatigheid voorbij RGB. Front-endteams krijgen een kant-en-klare HTML-kleurkiezer- en CSS-kleurkiezer-workflow: exporteer CSS-variabelen, Tailwind-v4-themetokens, een Tailwind-v3-configobject, Figma-JSON of alleen de codes. De ingebouwde schermpipet (EyeDropper) sampelt elke pixel van je monitor, en de stippen op het kiezerwiel blijven bij elke helderheid sleepbaar. Deze online kleurkiezer is gratis, met alfa-exports voor elke RGBA-toepassing. De aangepaste modus bevriest elke gegenereerde set in een met de hand bewerkbare lijst: maak een staal lichter of donkerder, sleep om te herschikken, voeg een gemengd midden in of verleng een uiteinde — elke wijziging direct weerspiegeld in de deelbare URL.
Fotografen en merkdesigners grijpen naar de afbeeldingskleurkiezer om paletten uit de echte wereld te lenen. Upload een foto — of plak een afbeeldings-URL — en de kiezer uit afbeelding toont een loep met pixelraster en dradenkruis, om exact de pixel te lezen waar je naar wijst — zelfs bij 800% zoom. Vergrendel de kleur, kopieer als HEX, RGB, HSL of OKLCH en stuur met één klik naar het wiel. Stel het gewonnen palet in van twee tot tien kleuren, download de strook als PNG of bewaar in de browservault voor later. Elke afbeelding die je opent blijft op je apparaat — niets wordt geüpload.
Als één staal niet genoeg is, bouwt de kleurenpaletgenerator in seconden een kant-en-klaar palet uit beelddata. Hij scoort pixels op frequentie en verzadiging, filtert bijna-duplicaten en ordent de winnaars op tint — twee tot tien kleuren om te herschikken, uit te breiden en te verwijderen. Portretretoucheurs waarderen de eigen huidtint-sets naast de pastel-, blauwe en groene collecties. Bewaar favorieten in de browservault, download elk kleurenpalet als PNG of SVG en exporteer tokens voor overdracht. Sleepbare knoppen rijden over de afbeelding op hun samplepunten — een kleur opnieuw picken wordt slepen in plaats van gissen.
Een complementair kleurenwiel paart tinten op 180° voor maximale spanning — oranje tegen blauw, violet tegen geel. De complementaire strook markeert je basiskleur met een zwarte stip, zodat je exact ziet welk staal je voor knoppen en links reserveert terwijl de dominante tint de lay-out leidt. Gesplitste, triadische, tetradische en vierkante draaiingen staan ernaast in het harmonieën paneel als zachtere of gedurfdere alternatieven.
Twaalf seizoensgebonden kleuranalysesystemen leven in de galerij — elk zeventien paletten. Warme, gedempte briefings starten met het zachte-herfstpalet, koele en gedempte grijpen naar het zachte-zomerpalet. Hoogwarme herfstpaletten dienen herfstcampagnes en foodmerken, en het diepe-winterpalet levert juweelglans op bijna-zwart voor luxe en avond. Lichte, warme designs putten uit het lichte-lentepalet, luchtig minimaal uit het koele-zomerpalet en opulent donker uit het diepe-herfstpalet. IJzig contrast hoort bij het koude-winterpalet, stralende warmte bij het warme-lentepalet, zachte middentonen bij het echte-zomerpalet en stille luxe bij het neutrale palet. Bredere zomer-, winter-, lente- en herfststemmingen ronden 400+ sets af — elk met één-klik-kopie voor HEX, RGB, HSL en OKLCH.
Als je hier belandde via Adobe color wheel, Adobe color picker, Canva color wheel of Google color picker, ken je de klus: van één merkkleur een gebalanceerde set maken. Ease Colors dekt hetzelfde terrein — harmonieën, HEX/RGB/HSL/OKLCH-codes, beeldsampling en paletexport — gratis in de browser, met deelbare URL's en geen account tussen jou en de stalen. Toetsenbord eerst, screenreaderlabels en modus voor verminderde beweging inbegrepen.
Open het kleurenwiel, test de kiezer uit afbeelding of blader door 400+ kleurenpaletten. Je volgende palet is één sleepbeweging ver.
Klik een staal aan. Wissel vóór het kopiëren naar HEX, RGB, HSL of OKLCH.
Druk op “Deellink kopiëren”. De URL codeert je basis, harmonie en helderheid.
Ja. Elke HEX, token en export is van jou — geen naamsvermelding nodig.
Het kleurenwiel is een cirkeldiagram dat tinten zo rangschikt dat relaties ruimtelijk worden: buurkleuren kalmeren, terwijl tegenkleuren spanning creëren. Tekenlessen leren een rood-geel-blauw wiel voor het mengen van verf; schermen gebruiken een RGB-wiel dat licht mengt. Ontwerpers gebruiken het om basiskleuren te kiezen, harmonieën te bouwen en contrast te checken voordat een palet ooit een lay-out bereikt.
Begin met één basiskleur — typ een HEX-code, open de systeemkiezer of sample je scherm. Kies een harmonie zoals analoog, complementair of triadisch en stem helderheid af met de buitenste ring tot achtergrond-, tekst- en accenttonen staan. Kopieer elk staal als HEX, RGB, HSL of OKLCH en plak de codes in CSS, Tailwind of Figma.
Het hoofddoel is kleuren combineren zonder gissen. In plaats van paren op het oog te vormen, lees je geometrie: afstand betekent contrast en nabijheid betekent rust. Dat geeft elke interface een heldere hiërarchie — één dominante tint, enkele supporters en een gereserveerd accent — zodat knoppen, links en koppen landen waar het oog ze verwacht.
De designliteratuur noemt meestal acht: monochromatisch (één tint, veel helderheden), analoog (buren), complementair (tegenpolen), gesplitst-complementair (een basis plus twee buren van zijn tegenpool), triadisch (driehoek), tetradisch of rechthoekig (twee complementaire paren), vierkant (vier hoeken) en achromatisch of neutraal (zwart, wit, grijs). Deze tool dekt er zes direct, plus een aangepaste modus voor met de hand bewerkte lijsten van twee tot acht kleuren.
Sleep een stip over de schijf: de hoek zet de tint en de afstand tot het midden zet de verzadiging. Sleep aan de buitenste ring voor helderheid zonder tint en verzadiging te raken. Je kunt ook een exacte HEX-waarde typen, het systeemkleurvak openen of een willekeurige monitorpixel kiezen met de schermkiezer — alle wegen leiden naar dezelfde deelbare basiskleur.
Een kleurkiezer maakt van een visuele keuze een exacte, herbruikbare waarde. Hij leest elke kleur als HEX-, RGB-, HSL- of OKLCH-codes zodat ontwerpers en ontwikkelaars dezelfde taal spreken: wat je aanklikt is byte-identiek aan wat in CSS, Tailwind-tokens of Figma-stijlen belandt — geen tinten meer schatten op het oog.
De hoofdtypen zijn wiel- of schijfkiezers (tint plus verzadiging in één oogopslag), sliderkiezers (RGB- of HSL-kanalen), HEX-velden (directe waarden), pipet- of schermkiezers (samplen je monitor), afbeeldingklezers (loep op foto) en paletbibliotheken (samengestelde sets zoals de 400+-galerij hier). Deze site verenigt alle zes in één workflow.
Een kleurcode is een tekstwaarde die exact één kleur beschrijft. HEX schrijft hem als zes hexadecimale cijfers (#EDEA37); RGB somt rood-, groen- en blauwkanalen op; HSL somt tint, verzadiging en helderheid op; OKLCH is een nieuwer perceptueel formaat waarin gelijke numerieke stappen er even verschillend uitzien. Alle vier beschrijven hetzelfde staal — het formaat verandert alleen hoe je het leest en bewerkt.
Kies een kleur met het wiel, een slider, het HEX-veld of de schermkiezer, en kopieer in het formaat dat je project nodig heeft — HEX voor het web, RGB of RGBA voor app-code, HSL voor snelle tweaks, OKLCH voor perceptuele gelijkmatigheid. Plak de waarde in je stylesheet, Tailwind-config of designtool, en bewaar de deellink zodat de exacte kleur later één klik ver is.
Een kleurenpalet houdt alle vlakken van een product in dezelfde visuele taal. Het deelt rollen uit — achtergrond, tekst, accenten, states — zodat interfaces coherent aanvoelen in plaats van uit losse stalen gemonteerd. Een goed palet bakt contrast en hiërarchie vooraf in: minder leesbaarheidsfixes en een sterker, herkenbaarder merk.
Gangbare soorten zijn monochromatische, analoge en complementaire paletten uit wielgeometrie; pastel- en neonpaletten naar energie; seizoenspaletten naar huidondertoon (van soft autumn tot neutraal); merkpaletten vastgepind op huisstijlkleuren; en geëxtraheerde paletten gesampled uit foto’s. De galerij hier host ze alle — 400+ sets in 60+ categorieën.
Start met een basiskleur bij de sfeer — warm en gedempt, koel en luchtig, of donker en dramatisch. Breid uit met een harmonie en toets het resultaat zoals gebruikers het treffen: lopendetekst-contrast, knopaccenten en kleurenblind-simulatie voor protanopie, deuteranopie, tritanopie. Overleeft het alle drie, deel de link en ship het.