Kleurkiezer
Kies elke kleur en krijg HEX, RGB en HSL waarden direct. Klik op het spectrum, pas de tint aan, kopieer de code.
Hoe je de kleurkiezer gebruikt
Kies
Klik ergens op het kleurenspectrum om een kleur te kiezen. Gebruik de tintschuif eronder om de basistint te veranderen.
Lees
De HEX, RGB, HSL en CSS waarden worden direct bijgewerkt. Je kunt ook rechtstreeks een HEX-code in het invoerveld typen.
Kopiëren
Klik op de kopiëerknop naast een waarde om deze naar je klembord te kopiëren. Recente kleuren worden opgeslagen in de geschiedenisbalk.
Kleurformaatverwijzing
| Formaat | Voorbeeld | Gebruikt in | Voordeel |
|---|---|---|---|
| HEX | #FF5733 | CSS, HTML, designtools | Compact, algemeen bekend |
| RGB | rgb(255, 87, 51) | CSS, JavaScript, Photoshop | Komt overeen met hoe schermen kleur weergeven |
| HSL | hsl(11, 100%, 60%) | CSS, moderne designsystemen | Intuïtief aan te passen (tint, verzadiging, lichtsterkte) |
Veel voorkomende toepassingen
Webontwikkeling
Kies kleuren voor CSS-stylesheets, React-componenten en designtokens. Kopiëer HEX- of HSL-waarden rechtstreeks in je code.
Grafisch ontwerp
Vind exacte kleurwaarden voor Figma, Photoshop, Illustrator of Canva. Match merkleuren door een bekende HEX-code in te voeren.
Presentaties
Kies aanvullende kleuren voor PowerPoint of Google Slides. Gebruik het spectrum om kleuren te vinden die goed samengaan.
Sociale media
Match merkleuren voor afbeeldingen op sociale media, banners en profielelementen. Kopiëer CSS-waarden voor webgebaseerde designtools.