ximg.es

Convertisseur de couleurs

Saisissez une couleur dans n’importe quel format CSS (ou choisissez-la) et obtenez-la en HEX, RGB, HSL, HWB et OKLCH, avec son nom CSS et l’image ximg.es de cette couleur.

Essayez
La couleur dans chaque format
HEX #2563eb
RGB rgb(37, 99, 235)
HSL hsl(221, 83.2%, 53.3%)
HWB hwb(221 14.5% 7.8%)
OKLCH oklch(54.61% 0.215 262.9)
Nom CSS royalblue (le plus proche)
URL ximg.es https://ximg.es/600x300/2563eb/fff
Image ximg.es avec la couleur choisie en fond

Quel format de couleur utiliser

Pourquoi OKLCH est à la mode

En HSL, un jaune et un bleu à 50% de luminosité n’ont rien à voir en clarté. En OKLCH, si, ce qui permet de créer des échelles de couleurs cohérentes (100, 200… 900) en changeant seulement L, et des dégradés sans zone grise au milieu. OKLCH peut aussi décrire des couleurs plus vives que le sRGB pour les écrans P3 ; dans ce cas, l’outil vous prévient et affiche en HEX et RGB la couleur représentable la plus proche. Tous les navigateurs actuels comprennent oklch().

Les couleurs dans les URL d’ximg.es

Le générateur de placeholders reçoit la couleur de fond et celle du texte dans l’URL même, en hexadécimal sans dièse : /600x300/2563eb/fff. Il accepte 3, 4, 6 et 8 chiffres (ceux à 4 et 8 incluent la transparence en PNG, WebP et AVIF), les raccourcis à 1 et 2 chiffres (c vaut cccccc) et les 148 noms CSS : /600x300/tomato/white. La dernière ligne du convertisseur vous donne l’URL avec le texte en blanc ou en noir, selon celui qui contraste le mieux.

Les noms de couleurs CSS

Le CSS compte 148 noms, d’aliceblue à yellowgreen. Si la couleur n’a pas de nom propre, l’outil cherche le plus proche à l’œil (la distance se mesure en OKLab, pas en RGB), ce qui est pratique pour nommer des variables ou décrire une couleur dans une conversation.

Questions fréquentes

Comment convertir du HEX en RGB ?

Chaque paire de chiffres est un canal en hexadécimal : dans #2563eb, 25 vaut 37 de rouge, 63 99 de vert et eb 235 de bleu. Saisissez-le ci-dessus pour l’obtenir converti.

Qu’est-ce qu’une couleur HEX à 8 chiffres ?

Un HEX avec transparence : les deux derniers chiffres sont l’alpha, de 00 (transparent) à ff (opaque). 80 correspond à environ 50 %.

Quelle différence entre HSL et OKLCH ?

Les deux séparent teinte, intensité et clarté, mais OKLCH est calibré sur la perception humaine : la même luminosité paraît aussi claire quelle que soit la teinte. En HSL, le jaune à 50 % paraît bien plus clair que le bleu à 50 %.

Peut-on utiliser OKLCH en production ?

Oui. Chrome, Edge, Firefox et Safari le prennent en charge depuis 2023. Si vous devez prendre en charge des navigateurs plus anciens, déclarez d’abord la même propriété en HEX comme solution de repli.

Pourquoi ma couleur OKLCH est-elle différente en HEX ?

Parce qu’OKLCH peut décrire des couleurs qui n’entrent pas dans le sRGB, l’espace du HEX et du RGB. La plus proche dans le sRGB est affichée et l’outil vous prévient.

Quelles couleurs ximg.es accepte-t-il dans l’URL ?

L’hexadécimal sans # sur 1, 2, 3, 4, 6 ou 8 chiffres et les 148 noms CSS. Par exemple, https://ximg.es/600x300/2563eb/fff ou https://ximg.es/600x300/navy/gold.

Plus d'outils

Voir tous les outils · Générateur d'images placeholder