Flowfiles ← Tous les outils

Convertisseur HEX ↔ RGB ↔ HSL ↔ OKLCH

Bidirectionnel · Temps réel · Copie instantanée — 100% local, sans upload

Saisissez ou collez n'importe quelle valeur de couleur en HEX, RGB, HSL ou OKLCH et toutes les autres représentations se mettent à jour instantanément. Inclut un aperçu de couleur en direct et une copie en un clic pour chaque format. Tout fonctionne dans votre navigateur — aucune donnée ne quitte votre appareil.

T 217°
S 91%
L 60%

#3b82f6
HEX
#3b82f6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
OKLCH

Pourquoi convertir entre les formats de couleurs ?

Les différents workflows utilisent différents espaces colorimétriques. Le CSS s'appuyait historiquement sur hex et rgb(), tandis que les outils de design comme Figma privilégient HSL pour son modèle lisible teinte/saturation/luminosité. OKLCH est le standard moderne : il est perceptuellement uniforme, ce qui signifie que des pas numériques égaux produisent des différences de couleur visuellement égales — parfait pour générer des palettes de couleurs accessibles et des dégradés prévisibles.

Fonctionnalités

Questions fréquentes

Qu'est-ce que l'OKLCH et pourquoi l'utiliser ?

OKLCH signifie Luminosité, Chroma, Teinte — construit sur le modèle de couleur perceptuel OKLab. Contrairement au HSL, il garantit que deux couleurs avec la même valeur L paraissent également lumineuses à l'œil humain. Cela le rend bien supérieur pour construire des systèmes de design accessibles, des palettes en mode sombre, et des échelles de propriétés CSS personnalisées.

L'OKLCH est-il supporté en CSS ?

Oui. La fonction oklch() est disponible dans tous les navigateurs modernes depuis 2023 (Chrome 111+, Firefox 113+, Safari 15.4+). Exemple : color: oklch(0.7 0.15 200);. Elle peut même exprimer des couleurs hors de l'espace sRGB pour les écrans à large gamut P3.

Quelle est la différence entre HSL et OKLCH ?

HSL est une remapping cylindrique de sRGB — simple mais pas perceptuellement uniforme. Un jaune à la luminosité HSL 50% paraît bien plus lumineux qu'un bleu à la même valeur. OKLCH corrige cela : des valeurs L égales produisent une luminosité visuellement égale, le rendant bien plus prévisible pour le travail de design.

Comment convertir une couleur HEX en RGB ?

Une couleur hex comme #3b82f6 se divise en trois paires : 3b=59 (Rouge), 82=130 (Vert), f6=246 (Bleu). Chaque paire est un nombre hexadécimal entre 0 et 255. La notation abrégée comme #fff s'étend à #ffffff en doublant chaque chiffre.

Les données sont-elles envoyées sur un serveur ?

Non. Toute la conversion de couleurs s'exécute entièrement en JavaScript dans votre navigateur. Aucune valeur de couleur, aucune requête, aucun suivi — vos données ne quittent jamais votre appareil.

Outils associés