Sélecteur de couleur
Vérifiez le contraste WCAG, créez des dégradés CSS et générez des palettes de couleurs.
Vous voulez juste choisir une couleur ou convertir HEX ↔ RGB ↔ HSL (avec pipette) ? Utilisez le Convertisseur HEX RGB.
Exemples
Vérification de contraste
Entrée
#1A1A1A sur #F5F5F5
Sortie
≈ 16:1 — réussit AA & AAA
Dégradé CSS
Entrée
#3B82F6 → #9333EA, 90°
Sortie
background: linear-gradient(90deg, #3B82F6, #9333EA);
Palette
Entrée
#3B82F6
Sortie
Nuances + couleurs complémentaires, analogues, triadiques
À propos de cet outil
Ce studio de couleur en ligne et gratuit réunit trois essentiels : un vérificateur de contraste WCAG avec réussite/échec AA/AAA et aperçu de texte en direct ; un générateur de dégradés CSS avec déclaration prête à copier ; et un générateur de palettes pour nuances et couleurs complémentaires, analogues et triadiques. Chaque onglet a un sélecteur de couleur intégré, et tout s'exécute dans votre navigateur sans envoi. Pour la conversion pure HEX ↔ RGB ↔ HSL et une pipette à l'écran, utilisez le {link}.
Mode d'emploi
- Contraste : réglez les couleurs de texte et de fond pour vérifier l'accessibilité WCAG.
- Dégradé : choisissez deux couleurs et un angle, puis copiez le CSS.
- Palette : saisissez une couleur de base et cliquez sur un échantillon pour la copier.
Pour qui
Designers et développeurs qui vérifient la conformité d'accessibilité, construisent des fonds CSS et créent des palettes cohérentes — sans jongler entre outils séparés.
Questions fréquentes
Que peut faire cet outil de couleur ?
Trois choses au même endroit : vérifier le contraste WCAG entre deux couleurs, construire un dégradé CSS et générer des palettes de nuances et d'harmonies à partir d'une couleur de base. Chaque onglet a un sélecteur de couleur intégré.
Est-il gratuit ?
Oui — entièrement gratuit sans inscription, et tout s'exécute dans votre navigateur sans envoi.
Comment fonctionne le vérificateur de contraste ?
Saisissez une couleur de texte et une couleur de fond et il affiche le rapport de contraste WCAG plus réussite/échec pour AA et AAA sur texte normal et grand, avec un aperçu en direct.
Quel rapport de contraste me faut-il ?
WCAG AA exige au moins 4,5:1 pour le texte normal et 3:1 pour le grand texte ; AAA exige 7:1 et 4,5:1 respectivement. Le vérificateur signale chaque niveau pour vous.
Puis-je copier le dégradé CSS et les couleurs de la palette ?
Oui. L'onglet dégradé donne une déclaration background: prête à copier, et chaque échantillon de palette copie son hex au clic.
Où choisir une couleur ou convertir HEX/RGB/HSL ?
Utilisez le Convertisseur HEX RGB dédié — il choisit une couleur (avec pipette à l'écran sur Chrome/Edge) et affiche HEX, RGB et HSL. Ce studio se concentre sur ce que vous faites avec les couleurs : contraste, dégradés et palettes.
Puis-je capturer une couleur d'une page web ou d'une image ?
Oui — utilisez la pipette du Convertisseur HEX RGB (et son bookmarklet) pour capturer une couleur n'importe où à l'écran sur Chrome et Edge, puis ramenez le hex ici.
Outils associés