Design
Convertisseur de couleurs
HEX, RGB, HSL — convertissez vos couleurs instantanement. Color picker inclus.
#0D4F3C
rgb(13, 79, 60)
Color Picker
RGB
HSL
Tous les formats
#0D4F3Crgb(13, 79, 60)hsl(163, 72%, 18%)--color: #0D4F3C;Comment utiliser le convertisseur de couleurs
Choisissez visuellement ou saisissez un code, et obtenez instantanement les equivalents HEX, RGB et HSL prets a copier dans votre CSS ou votre logiciel de design.
Choisir la couleur source
Trois methodes au choix : cliquez sur le color picker pour la selectionner visuellement, tapez un code hexadecimal comme #0d4f3c, ou ajustez les curseurs RGB ou HSL pour affiner. La preview en haut de page se met a jour en temps reel.
Comparer les trois formats
La carte HEX, RGB et HSL affiche simultanement les trois representations de la meme couleur. Chaque format est utile dans un contexte different : HEX pour le HTML, RGB pour la transparence avec rgba, HSL pour generer des variations harmonieuses.
Copier la valeur dans son projet
Chaque format dispose d'un bouton Copier qui place la valeur formatee dans le presse-papiers : par exemple rgb(13, 79, 60) ou hsl(160, 72%, 18%). Collez directement dans votre fichier CSS, Tailwind config, Figma ou Photoshop.
Cas d'usage du convertisseur de couleurs
Designer web et UI
Vous recevez une charte graphique en HEX mais Figma exporte en RGB. Le convertisseur unifie tout en un clic. Pour creer des variations (hover, focus, disabled), ajustez la luminosite HSL de 10 % en plus ou en moins, sans toucher a la teinte. Plus rapide qu'un selecteur visuel.
Developpeur Tailwind ou CSS variables
Tailwind v4 supporte les couleurs en HSL pour des manipulations runtime (theming dark mode). Le convertisseur transforme un brand color HEX en hsl() pret a coller dans tailwind.config ou globals.css. Pour les CSS variables : --color-primary: 160 72% 18% permet de moduler l'alpha sans dupliquer.
Print et impression
L'impression utilise CMJN (cyan, magenta, jaune, noir), pas RGB. Attention : un rouge eclatant a l'ecran (RGB 255,0,0) sortira terne en print. Le convertisseur donne une indication CMJN approximative pour estimer le rendu, mais validez toujours avec un BAT (bon a tirer) chez l'imprimeur.
Verification de contraste accessibilite
Pour le respect des criteres WCAG AA, le ratio de contraste texte/fond doit etre superieur a 4,5:1 (3:1 pour les grands titres). Le convertisseur HSL aide a moduler la luminosite jusqu'a obtenir un contraste conforme, sans perdre l'identite chromatique de la marque.
A savoir sur les couleurs en design numerique
HEX, RGB et HSL representent strictement la meme couleur.Ce sont juste trois notations differentes du meme point dans l'espace colorimetrique sRGB. HEX est compact (#0d4f3c, 7 caracteres). RGB est lisible par humain (rouge/vert/bleu sur 0-255). HSL est manipulable intuitivement (la teinte, la saturation et la luminosite correspondent a la perception visuelle).
WCAG impose un contraste minimal pour l'accessibilite.Le ratio doit etre superieur a 4,5:1 entre texte normal et fond (niveau AA), et superieur a 7:1 pour le niveau AAA. Pour les titres de plus de 18px, la barre tombe a 3:1. Plus de 60 % des sites webs francais sont non conformes : c'est une obligation legale (loi Handicap 2005, RGAA) pour les services publics et les entreprises de plus de 250 millions de chiffre d'affaires.
Web et print n'utilisent pas le meme espace colorimetrique.Le web travaille en sRGB additif (lumiere). L'impression travaille en CMJN soustractif (encre). Certaines couleurs sRGB (tres saturees, fluo) sont hors gamut CMJN et sortiront ternes a l'impression. C'est pourquoi les chartes graphiques pro fournissent toujours les deux equivalents.
Le format HSL est ideal pour generer des palettes. Pour obtenir une couleur complementaire, ajoutez 180 a la teinte. Pour des triadiques, espacez par 120. Pour creer une variation plus claire, augmentez la luminosite. Cette logique geometrique est reproductible et evite les choix esthetiques arbitraires, ce qui plait aussi bien aux designers qu'aux developpeurs qui generent des themes par script.
Questions frequentes
Les questions les plus posees sur la conversion de couleurs.
HEX represente une couleur en 6 caracteres precedes d'un # (ex : #0d4f3c). RGB definit une couleur par ses composantes Rouge, Vert, Bleu (0-255). HSL utilise la Teinte (0-360 deg), la Saturation (0-100 %) et la Luminosite (0-100 %). Les trois formats sont interchangeables et representent strictement les memes couleurs.
Outils similaires
Ces outils pourraient aussi vous interesser
Generateur d'avatar
Creez un avatar avec vos initiales. Cercle colore, styles varies. Telechargez en PNG.
Utiliser →Generateur de gradient
Creez des degrades CSS : lineaire, radial, couleurs, angle. Apercu et code CSS pret a copier.
Utiliser →Politique de confidentialite
Generez une politique de confidentialite conforme RGPD pour votre site web.
Utiliser →PDF vers Texte
Analysez vos PDF : metadonnees, pages, dimensions. Extrayez et telechargez des pages individuelles.
Utiliser →