Toolosaurus

Color Converter & Contrast

Convert HEX, RGB, HSL, and CMYK colors accurately and test WCAG accessibility contrast ratios.

UtilitairesMis à jour : Octobre 2026
Klicken zum Auswählen
HEX
#4F46E5
RGB
rgb(79, 70, 229)
HSL
hsl(243, 75%, 59%)
CMYK
cmyk(66%, 69%, 0%, 10%)

WCAG 2.1 Kontrast-Prüfer

Barrierefreiheit nach offiziellen W3C-Richtlinien

Vordergrund:
Hintergrund:
Beispieltext für Kontrast
Dies ist Fließtext in normaler Schriftgröße (16px / Regular).
6.29:1
Kontrastverhältnis
Normaler Text (< 18pt)
AA BestandenAAA Nicht erfüllt
Großer Text (≥ 18pt / Fett)
AA BestandenAAA Bestanden
UI & Grafische Elemente
AA Bestanden
Step-by-step

How Color Converter & Contrast Works

Convert HEX, RGB, HSL, and CMYK colors accurately and test WCAG accessibility contrast ratios.

1

1. Saisir un code couleur ou utiliser la pipette

Saisissez ou collez votre code couleur dans le champ dédié, ou sélectionnez une nuance à l’aide du sélecteur interactif. L’outil accepte les formats HEX (3, 6 ou 8 caractères avec alpha), RGB/RGBA, HSL/HSLA, HSV/HSB, CMYK, CIE-Lab et CIE-LCh.

2

2. Détection automatique du modèle colorimétrique

Notre moteur d’analyse mathématique identifie instantanément la syntaxe d’entrée, vérifie les plages de valeurs et synchronise l’ensemble des espaces de couleurs dans la mémoire vive du navigateur.

3

3. Consulter les conversions et le contraste WCAG

Examinez en temps réel les formats générés : syntaxes CSS Color Module 4 modernes (lch, lab, oklch, color(display-p3)), valeurs CMYK calibrées pour l’impression et ratios de contraste d’accessibilité.

4

4. Copier les codes en un clic dans le presse-papiers

Cliquez sur l’icône de copie située en regard du format souhaité (CSS, Tailwind CSS, Swift, XML Android ou variables Figma) pour coller des valeurs prêtes pour la production.

Key Benefits & Data Privacy

Conversion universelle et simultanée entre HEX, RGB, HSL, HSV, CMYK, LAB, LCH et XYZ
Prise en charge intégrale des syntaxes avancées CSS Color Module 4 (oklch, oklab, display-p3)
Gestion précise de la transparence avec code hexadécimal à 8 caractères (#RRGGBBAA)
Calculs de colorimétrie mathématique calibrés selon l’illuminant standardisé CIE D65
Audit d’accessibilité et de contraste en temps réel conforme aux critères WCAG 2.1 AA et AAA
Exportation rapide de fragments de code optimisés pour CSS, Tailwind, Swift et XML Android
Traitement 100 % client-side dans le navigateur garantissant rapidité et confidentialité

Vérifié et Développé par l’Équipe Technique Toolosaurus

Traitement conforme au RGPD • Confidentialité stricte dans le navigateur • Hébergement en Allemagne

Certifié RGPDData center ISO 27001
Guide pratique et expertise

Tout savoir sur Color Converter & Contrast

Physique de la couleur : Synthèse additive des écrans et soustractive de l’imprimerie

La génération de couleurs dans l’univers numérique et sur support imprimé repose sur deux principes physiques opposés. Les écrans d’ordinateurs, de smartphones et de téléviseurs fonctionnent par synthèse additive à partir des trois couleurs primaires de lumière : le rouge, le vert et le bleu (RGB). Lorsque ces trois faisceaux sont émis à leur puissance maximale (255, 255, 255), ils créent de la lumière blanche pure. À l’inverse, l’imprimerie utilise la synthèse soustractive avec des encres cyan, magenta, jaune et noire (CMYK). Les pigments déposés sur le papier absorbent certaines longueurs d’onde du spectre lumineux ambiant, de sorte que l’accumulation d’encre assombrit le rendu. L’espace sRGB des écrans étant sensiblement plus large que le spectre des encres d’imprimerie, une conversion sans profil colorimétrique adapté produit des impressions ternes. Notre outil applique des transformations calibrées pour maintenir la cohérence entre supports numériques et physiques.

Modèles cylindriques : Maîtriser HSL et HSV/HSB pour les Design Systems

Bien que les coordonnées RGB soient idéales pour les cartes graphiques, elles demeurent peu intuitives pour l’esprit humain : il est difficile de concevoir qu’un vert menthe corrisponde aux valeurs numériques (46, 204, 113). Les représentations cylindriques telles que HSL (Teinte, Saturation, Luminosité) et HSV/HSB (Teinte, Saturation, Valeur/Brillance) ont été conçues pour traduire la couleur selon des axes perceptibles. La teinte (Hue) se mesure sur un cercle chromatique de 0° à 360°, progressant du rouge (0°) au jaune (60°), vert (120°), cyan (180°), bleu (240°) et magenta (300°). La différence essentielle réside dans l’axe vertical : HSL associe 100% de luminosité au blanc absolu, plaçant la couleur saturée à 50% de luminosité, tandis que HSV maintient à 100% de brillance le pigment pur dans toute son intensité lumineuse. Notre outil expose simultanément ces deux approches pour faciliter la création de chartes graphiques sous Figma et CSS.

Espaces perceptuellement uniformes : CIE-Lab, LCh et le standard moderne Oklch

Les espaces classiques comme sRGB et HSL souffrent d’un défaut majeur : ils ne sont pas perceptuellement uniformes. Pour le système visuel humain, un jaune pur (rgb(255,255,0)) apparaît considérablement plus lumineux qu’un bleu pur (rgb(0,0,255)), bien que le modèle HSL leur attribue à tous deux une luminosité identique de 50%. La Commission Internationale de l’Éclairage a pallié cette anomalie en introduisant les espaces CIE L*a*b* et CIE L*C*h, calibrés sur la sensibilité réelle des cônes de la rétine humaine. Le standard moderne CSS Color Module Level 4 franchit une nouvelle étape avec les fonctions oklab() et oklch(). Celles-ci garantissent des transitions de couleurs naturelles sans teintes grises intermédiaires indésirables. Notre convertisseur vous offre l’ensemble des coordonnées nécessaires pour exploiter ces technologies d’avant-garde.

Accessibilité numérique : Conformité des contrastes et de la luminance WCAG 2.1

La conception d’interfaces numériques accessibles et conformes aux normes légales est une obligation incontournable. Les Règles pour l’accessibilité des contenus web (WCAG 2.1 / 2.2) définissent des ratios de contraste obligatoires entre les textes et leurs arrière-plans afin d’assurer une lisibilité optimale pour les personnes malvoyantes ou dans des conditions d’éblouissement. Le niveau de conformité AA impose un contraste minimal de 4,5:1 pour le texte courant et de 3,0:1 pour les grands titres (18pt ou 14pt gras). Le niveau d’excellence AAA requiert quant à lui un ratio de 7,0:1. Notre convertisseur calcule instantanément la luminance relative normalisée selon les standards ISO et affiche un diagnostic de conformité face au blanc et au noir, garantissant ainsi des choix graphiques esthétiques et conformes aux exigences d’accessibilité.

FAQ

Frequently Asked Questions

Topic Cluster

Related Tools

View all 50 tools

ZIP Master

Upload multiple files and download them as a compressed ZIP archive.

Open

Smart Converter

Convert units (length, weight, temp) and current exchange rates.

Open

Générateur de Mots de Passe Sécurisés

Générez des mots de passe ultra-sécurisés, aléatoires et personnalisés pour tous vos comptes.

Open

Text Encryption

Encrypt and decode texts (Base64, SHA256).

Open