* Votre contenu n'est pas transféré vers le serveur. Tous les calculs sont effectués directement dans le navigateur
HEX
RGB
HSL
HSV
CMYK
LAB
OKLCH
HSV est indiqué à titre de référence. CSS n'a pas de fonction hsv(), utilisez HSL.
Variable CSS
--color-primary: #06d6a0;
Utilitaire Tailwind
bg-[#06d6a0]
Tailwind v4 @theme
@theme {
  --color-primary: oklch(78% 0.16 167);
}

À propos de la conversion de couleurs

Un convertisseur de couleurs traduit la même couleur entre les formats utilisés sur le web, en impression et en design : HEX pour CSS, RGB/HSL pour les ajustements en direct, CMYK pour l'impression, LAB/OKLCH pour l'uniformité perceptuelle.

Espaces colorimétriques
HEX, notation RGB compacte à 6/8 chiffres. Le format par défaut en CSS.
RGB, primaires additives de 0 à 255. Correspond directement aux pixels de l'écran.
HSL, teinte/saturation/luminosité. Plus intuitif que RGB pour le raisonnement humain.
HSV, teinte/saturation/valeur. Courant dans les outils de design, mais pas une fonction CSS.
CMYK, primaires soustractives utilisées en impression. Approximatif lors de la conversion depuis RGB.
LAB, uniformité perceptuelle : une distance numérique égale correspond à une différence visuelle égale.
OKLCH, espace perceptuel moderne, recommandé par Tailwind v4 et CSS Color Module Level 4.
Contraste (WCAG vs APCA)

WCAG 2.1 utilise un rapport de luminance (de 1:1 à 21:1) avec des seuils AA/AAA. Il est largement supporté mais ne prend pas parfaitement en compte la perception des petits textes ou du mode sombre.

APCA est un candidat pour WCAG 3 avec un score Lc sensible à la polarité. Il corrèle mieux avec la lisibilité pour les textes fins ou de petite taille.

Astuces

  • Utilisez la pipette pour prélever une couleur depuis n'importe quel pixel de votre écran (navigateurs Chromium).
  • Déposez une image dans l'onglet Palette pour extraire ses 6 couleurs dominantes par quantification median-cut.
  • Tailwind v4 génère les couleurs en OKLCH pour une fluidité perceptuelle. Copiez le bloc @theme pour vous aligner sur ce flux de travail.