Tanaguru Contrast-Finder

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. Rouge : Vert : Bleu : La couleur doit être comprise entre #000000 à #FFFFFF Hexadécimal :

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

Ratio minimum :

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 :

Modifier la couleur du texte Modifier la couleur du fond

Propose-moi :

les couleurs valides et très proches de la couleur initiale une palette de couleurs valides

Ancien contraste

Contraste invalide
Avant plan	Arrière plan	Exemple	Ratio	Distance
hsl(240, 53%, 43%) rgb(51, 51, 170) #3333AA	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.	1.92393

Nouveau contraste : 39 résultats (5 080 320 couleurs testées)

Contrastes valides
Avant plan	Arrière plan	Exemple	Ratio	Distance
hsl(235, 87%, 67%) rgb(100, 111, 245) #646FF5	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50064	91.08
hsl(236, 94%, 69%) rgb(101, 109, 251) #656DFB	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50033	94.78
hsl(235, 86%, 67%) rgb(101, 111, 244) #656FF4	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50002	90.7
hsl(239, 97%, 70%) rgb(106, 107, 253) #6A6BFD	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50075	97.04
hsl(240, 96%, 70%) rgb(107, 107, 252) #6B6BFC	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50041	96.64
hsl(238, 79%, 67%) rgb(107, 111, 238) #6B6FEE	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.5001	89.05
hsl(240, 94%, 70%) rgb(108, 107, 251) #6C6BFB	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50025	96.27
hsl(238, 78%, 67%) rgb(108, 111, 237) #6C6FED	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50076	88.87
hsl(236, 62%, 64%) rgb(108, 115, 221) #6C73DD	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50052	83.39
hsl(240, 93%, 70%) rgb(109, 107, 250) #6D6BFA	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	95.93
hsl(237, 64%, 65%) rgb(109, 114, 224) #6D72E0	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50009	84.47
hsl(241, 92%, 69%) rgb(110, 107, 249) #6E6BF9	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50049	95.61
hsl(238, 67%, 66%) rgb(110, 113, 227) #6E71E3	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50073	85.68
hsl(241, 90%, 69%) rgb(111, 107, 248) #6F6BF8	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50089	95.32
hsl(240, 82%, 68%) rgb(111, 109, 241) #6F6DF1	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50009	91.62
hsl(236, 49%, 62%) rgb(112, 117, 207) #7075CF	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50091	82.68
hsl(235, 42%, 60%) rgb(112, 119, 197) #7077C5	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	82.48
hsl(241, 74%, 67%) rgb(114, 110, 234) #726EEA	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	89.53
hsl(238, 50%, 63%) rgb(114, 116, 209) #7274D1	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50079	83.59
hsl(243, 89%, 69%) rgb(115, 106, 247) #736AF7	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50021	96.01
hsl(242, 69%, 66%) rgb(115, 111, 229) #736FE5	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50065	88.09
hsl(241, 65%, 66%) rgb(115, 112, 225) #7370E1	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.5004	86.87
hsl(243, 80%, 68%) rgb(116, 108, 239) #746CEF	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50052	92.38
hsl(237, 36%, 60%) rgb(116, 119, 191) #7477BF	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	84.26
hsl(241, 54%, 64%) rgb(117, 114, 214) #7572D6	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50078	85.4
hsl(236, 28%, 57%) rgb(117, 121, 178) #7579B2	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50068	85.77
hsl(244, 73%, 67%) rgb(118, 109, 233) #766DE9	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50086	90.69
hsl(242, 57%, 64%) rgb(118, 113, 217) #7671D9	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50078	86.31
hsl(244, 64%, 65%) rgb(119, 111, 224) #776FE0	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50096	88.28
hsl(236, 21%, 56%) rgb(119, 122, 168) #777AA8	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	87.6
hsl(241, 35%, 60%) rgb(120, 118, 190) #7876BE	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50009	86.05
hsl(241, 26%, 58%) rgb(121, 120, 177) #7978B1	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50089	87.58
hsl(242, 29%, 58%) rgb(122, 119, 181) #7A77B5	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50005	87.66
hsl(238, 14%, 54%) rgb(122, 123, 155) #7A7B9B	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50051	89.95
hsl(244, 32%, 59%) rgb(123, 118, 185) #7B76B9	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50061	87.82
hsl(241, 16%, 55%) rgb(123, 122, 160) #7B7AA0	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50017	90.05
hsl(237, 9%, 52%) rgb(123, 124, 145) #7B7C91	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50061	90.72
hsl(243, 15%, 54%) rgb(124, 122, 158) #7C7A9E	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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.50099	90.66
hsl(243, 6%, 51%) rgb(125, 124, 140) #7D7C8C	hsl(0, 100%, 10%) rgb(51, 0, 0) #330000	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	91.55

Pas satisfait ?

Propose moi une palette de couleurs valides

tanaguru contrast finder

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

Ancien contraste

Nouveau contraste : 39 résultats (5 080 320 couleurs testées)

Produits

Suivez-nous

Langue :

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

Ancien contraste

Nouveau contraste : 39 résultats (5 080 320 couleurs testées)

Produits

Suivez-nous

Langue :

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