Convertisseur de couleur
Convertissez vos couleurs en temps réel entre les formats HEX, RGB, HSL, CMJN et CIE LAB. Comprend l’audit de contraste WCAG 2.1, l’alerte de gamut d’impression et le simulateur de daltonisme.
Outils en Ligne#3B82F6
Détection des phosphores RGB additifs hors gamut incompatibles avec l’impression soustractive en quadrichromie.
Calcul de luminance relative en temps réel et validation de lisibilité par rapport au blanc pur et au noir pur.
Systèmes de Design & Typographie Numérique
Clarté visuelle et fort contraste pour les interfaces logicielles, les bibliothèques de composants et les expériences inclusives.
Systèmes de Design & Typographie Numérique
Clarté visuelle et fort contraste pour les interfaces logicielles, les bibliothèques de composants et les expériences inclusives.
Matrices de projection scientifique (Brettel / Machado) simulant les différentes formes de daltonisme.
Trichromatie (Vision Normale)
Perception humaine standard sur l’ensemble du spectre visible
Protanopie (Insensibilité au Rouge)
Anomalie des cônes L ; sensibilité amoindrie aux grandes longueurs d’onde rouges (~1% des hommes)
Deutéranopie (Insensibilité au Vert)
Anomalie des cônes M ; confusion rouge-vert, forme de daltonisme la plus répandue (~5% des hommes)
Tritanopie (Insensibilité au Bleu)
Anomalie des cônes S ; confusion bleu-jaune, forme rare (~0,01% de la population)
Achromatopsie (Monochromatisme Total)
Absence totale de fonction des cônes ; vision exclusive en niveaux de gris (~0,003% de la population)
Synchronisation mathématique bidirectionnelle instantanée sur 7 formats standards de l’industrie.
Déclinaison de teintes harmonieuses pour UI par variation calculée de luminosité sans altérer la teinte pure.
Variables et tokens de design system prêts pour une intégration immédiate.
// Utilitaires de couleur arbitraires Tailwind CSS <div className="bg-[#3b82f6] text-white border-[#3b82f6]" />
Guide d'Utilisation : Convertisseur de Couleurs & Studio d'Accessibilité (Étape par Étape)
Maîtrisez la conversion d'espaces colorimétriques, l'audit de contraste WCAG 2.1, le gamut d'impression et l'export de tokens.
Saisir une Couleur ou Utiliser le Collage Intelligent
Tapez, collez ou sélectionnez n'importe quel format dans la barre de recherche intelligente : HEX (#3b82f6), RGB, HSL, HSV, CMYK, CIE LAB ou des noms de couleurs CSS (ex. 'coral', 'indigo'). Le moteur détecte automatiquement le format et synchronise tous les affichages en temps réel.
Ajuster les Canaux avec les Curseurs Interactifs
Modifiez chaque composante grâce aux curseurs en direct : Rouge, Vert, Bleu, Alpha, Teinte (Hue), Saturation, Luminosité ou pourcentages d'encre CMJN. Consultez la palette monochrome en 5 étapes pour élaborer des dégradés d'interface harmonieux.
Auditer l'Accessibilité et le Contraste WCAG 2.1
Vérifiez les ratios de contraste sur fond blanc et noir grâce à l'auditeur intégré. Assurez-vous que vos textes respectent les critères de niveau AA (minimum 4.5:1 pour le texte standard, 3:1 pour le grand texte) et AAA (7:1) selon les normes WCAG.
Contrôler le Gamut d'Impression (Passerelle CMJN)
Vérifiez si vos teintes d'écran très vives peuvent être reproduites en impression quadrichromie physique. En cas d'alerte hors gamut, cliquez sur 'Restreindre au gamut d'impression' pour obtenir une approximation fidèle prête pour l'imprimerie.
Simuler les Déficiences Visuelles (Daltonisme)
Visualisez comment votre couleur est perçue par des personnes atteintes de Protanopie (absence de rouge), Deutéranopie (absence de vert), Tritanopie (absence de bleu) ou Achromatopsie (vision monochrome), pour garantir une accessibilité universelle.
Exporter les Tokens et Extraits de Code Développeur
Copiez les spécifications techniques complètes en un clic ou récupérez des extraits de code prêts pour la production en Tailwind CSS, Variables CSS (:root), SwiftUI (iOS) ou Jetpack Compose (Android).
Foire Aux Questions (FAQ)
Réponses techniques sur la colorimétrie, les espaces numériques, l'accessibilité web et l'impression professionnelle.
Q:Quelle est la différence entre les modèles de couleur RVB, HSL et CMJN ?
Le modèle RVB (RGB) est additif et propre aux écrans numériques, combinant des faisceaux de lumière Rouge, Verte et Bleue entre 0 et 255. Le modèle HSL décrit les couleurs de façon intuitive par Teinte (Hue 0–360°), Saturation (0–100 %) et Luminosité (0–100 %), facilitant le travail de design. Le modèle CMJN (CMYK) est soustractif et destiné à l'imprimerie (Cyan, Magenta, Jaune, Noir) ; le papier absorbant la lumière, son gamut de couleurs est plus restreint que celui du RVB.
Q:Quelles sont les exigences de contraste WCAG 2.1 pour les niveaux AA et AAA ?
Les règles WCAG 2.1 imposent des ratios de contraste minimaux entre texte et arrière-plan pour garantir la lisibilité. Le niveau AA exige un ratio d'au moins 4.5:1 pour le texte standard et 3:1 pour le grand texte (18pt ou 14pt gras) et les éléments d'interface. Le niveau AAA relève cette exigence à 7:1 pour le texte courant et 4.5:1 pour le texte de grande taille.
Q:Pourquoi les couleurs vives d'un écran paraissent-elles ternes à l'impression ?
Les écrans émettent de la lumière sur un large spectre (sRGB ou DCI-P3), permettant d'afficher des verts fluo ou des bleus électriques très saturés. Le papier physique ne fait que refléter la lumière ambiante et les encres de quadrichromie (CMJN) ne peuvent pas reproduire ces saturations extrêmes. Notre outil signale les couleurs hors gamut et calcule l'équivalent imprimable le plus fidèle.
Q:Qu'est-ce que l'espace colorimétrique CIE LAB et pourquoi est-il important ?
CIE L*a*b* est un espace de couleur indépendant de tout périphérique et perceptuellement uniforme, normalisé par la Commission internationale de l'éclairage. 'L' exprime la clarté perçue (0–100), 'a' l'axe vert-rouge et 'b' l'axe bleu-jaune. Contrairement au RVB ou à l'HEX, une distance numérique en LAB correspond directement à la différence perçue par l'œil humain.
Q:Comment fonctionne le simulateur de daltonisme ?
Le simulateur applique des matrices de transformation basées sur les modèles physiologiques des cônes rétiniens : Protanopie (déficience des cônes L pour le rouge), Deutéranopie (déficience des cônes M pour le vert), Tritanopie (déficience des cônes S pour le bleu) et Achromatopsie (absence totale de vision des couleurs). Il restitue fidèlement la perception visuelle de chaque utilisateur.
Q:Qu'est-ce que la luminance relative et comment calcule-t-on le contraste ?
La luminance relative (Y) correspond à la luminosité perçue d'une couleur, normalisée entre 0 (noir) et 1 (blanc), selon la formule sRGB : Y = 0.2126·R_lin + 0.7152·G_lin + 0.0722·B_lin. Le ratio de contraste WCAG entre deux teintes est calculé par (L1 + 0.05) / (L2 + 0.05), où L1 est la luminance de la teinte la plus claire et L2 celle de la plus sombre.
Q:Mes palettes ou données de couleur sont-elles transmises à des serveurs distants ?
Non. 100 % des calculs, conversions d'espaces, audits de contraste WCAG et générations de code s'effectuent localement dans votre navigateur. Aucune donnée relative à vos couleurs n'est envoyée sur le réseau ni conservée sur nos serveurs.
Qu'est-ce que Convertisseur de couleur ?
FAQ Pratique : Création d'Identité de Marque
Composants du Studio de Couleurs
| Outil de l'Interface | Rôle Technique | Avantage pour le Designer |
|---|---|---|
| Générateur Monochromatique | Crée 5 étapes de couleur en décalant mathématiquement la luminosité. | Permet de construire une interface utilisateur cohérente tout en préservant la teinte. |
| Espace CIE LAB | Définit la couleur de manière indépendante du périphérique. | Assure une constance absolue de la couleur entre un écran Apple et un écran PC. |
| Auditeur de Contraste | Évalue la conformité des textes normaux et de grande taille. | Valide instantanément vos choix pour les systèmes de design inclusifs. |