Kies een kleur op een visueel veld en krijg de HEX-, RGB- en HSL-code.

  • Direct
  • Gratis
  • Privé (lokaal verwerkt)
  • Zonder registratie
HEX
RGB
HSL

Eén kleur, al zijn codes

Kies visueel een kleur, pas tint en dekking aan en krijg de HEX-, RGB- en HSL-codes klaar om in je CSS te plakken. Klik een waarde om te kopiëren.

  1. Stel de tint in

    De regenboogschuif kiest de basiskleur.

  2. Verfijn op het veld

    Verzadiging horizontaal, helderheid verticaal.

  3. Kopieer de code

    HEX, RGB of HSL, met dekking indien nodig.

Voorbeeld: een fel oranje

FormaatWaarde
HEX#FF8800
RGBrgb(255, 136, 0)
HSLhsl(32, 100%, 50%)

Standaard sRGB-conversies, waarden afgerond op gehele getallen. Alles wordt in je browser berekend.

Veelgestelde vragen

Hoe werkt het kleurveld?

Het grote vierkant toont verzadiging (links naar rechts) en helderheid (onder naar boven) voor de met de schuif gekozen tint. Klik of sleep om te kiezen; de HEX/RGB/HSL-uitlezing werkt live bij.

Wat is het verschil tussen HEX, RGB en HSL?

HEX is een compacte hexadecimale code (#FF8800). RGB beschrijft de kleur via rood, groen, blauw (rgb(255, 136, 0)). HSL via tint, verzadiging, lichtheid (hsl(32, 100%, 50%)) — intuïtiever om een tint bij te stellen.

Waarvoor dient de dekking?

Ze regelt de transparantie (alfakanaal). Onder 100% worden codes rgba()/hsla() en krijgt HEX twee tekens erbij (bv. #FF8800CC). Handig voor overlays en schaduwen.

Is de kleur nauwkeurig voor het web?

Ja: waarden worden berekend met standaard sRGB-conversies en afgerond op gehele getallen. Kopieer het formaat dat bij je CSS past. Alles wordt lokaal berekend, niets wordt verzonden.