Fork me on GitHub

Trouve-moi les bons contrastes, pour l'accessibilité web,
entre ces deux couleurs :

Couleur du texte : couleur invalide Pour chaque couleur (rouge, vert et bleu), indiquer un nombre entre 0 et 255. La couleur doit être comprise entre #000000 à #FFFFFF
Couleur du fond : couleur invalide Pour chaque couleur (rouge, vert et bleu), indiquer un nombre entre 0 et 255. La couleur doit être comprise entre #000000 à #FFFFFF

Dans la réglementation internationale établie par les WCAG, le critère de succès 1.4.3 demande pour le texte un rapport de contraste minimum de 4.5:1 (et 3:1 pour le texte agrandi).

Ce rapport de contrast minimum est également exigé par la réglementation française, établie par le RGAA 3.0 2016, dans les critères 3.3 et 3.4.

Composante à modifier :
Propose-moi :

Ancien contraste

Contraste invalide
Avant plan Arrière plan Exemple Ratio Distance
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(0, 0%, 54%)
  • rgb(138, 138, 138)
  • #8A8A8A

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.46851

Nouveau contraste : 5 résultats (1 786 080 couleurs testées)

Contrastes valides
Avant plan Arrière plan Exemple Ratio Distance
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(1, 15%, 57%)
  • rgb(163, 131, 130)
  • #A38382

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.50019 24.54
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(3, 17%, 57%)
  • rgb(166, 130, 128)
  • #A68280

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.50018 27.34
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(3, 23%, 58%)
  • rgb(174, 127, 124)
  • #AE7F7C

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.50046 34.92
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(1, 24%, 59%)
  • rgb(176, 126, 125)
  • #B07E7D

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.50043 37.07
  • hsl(210, 10%, 14%)
  • rgb(33, 37, 41)
  • #212529
  • hsl(4, 27%, 58%)
  • rgb(179, 125, 121)
  • #B37D79

Titre de grande taille avec des mots en gras

Ceci est un echantillon de texte avec quelques mots en gras pour illustrer le bon contraste.

4.50028 39.54
Pas satisfait ?