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(0, 53%, 43%) rgb(170, 51, 51) #AA3333	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.	2.83192

Nouveau contraste : 51 résultats (2 779 920 couleurs testées)

Contrastes valides
Avant plan	Arrière plan	Exemple	Ratio	Distance
hsl(1, 26%, 54%) rgb(169, 110, 108) #A96E6C	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	73.1
hsl(4, 24%, 53%) rgb(165, 112, 108) #A5706C	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.50057	74.41
hsl(0, 17%, 53%) rgb(157, 115, 115) #9D7373	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.50004	80.52
hsl(4, 10%, 51%) rgb(144, 120, 118) #907876	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.50054	84.89
hsl(0, 28%, 54%) rgb(173, 108, 107) #AD6C6B	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.50066	71.19
hsl(0, 30%, 55%) rgb(175, 107, 106) #AF6B6A	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.5005	69.94
hsl(2, 36%, 55%) rgb(183, 103, 99) #B76763	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.50026	63.28
hsl(1, 40%, 55%) rgb(188, 100, 97) #BC6461	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.50029	60.44
hsl(4, 47%, 55%) rgb(195, 96, 88) #C36058	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.50093	53.99
hsl(1, 50%, 56%) rgb(200, 92, 90) #C85C5A	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.50082	53.74
hsl(1, 53%, 57%) rgb(204, 89, 87) #CC5957	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.50055	52.03
hsl(4, 61%, 55%) rgb(211, 84, 73) #D35449	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.5006	48.7
hsl(2, 64%, 56%) rgb(216, 79, 73) #D84F49	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.50084	50.65
hsl(2, 65%, 56%) rgb(217, 78, 72) #D94E48	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.50022	51.01
hsl(2, 66%, 56%) rgb(218, 77, 71) #DA4D47	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	51.45
hsl(2, 67%, 56%) rgb(219, 76, 70) #DB4C46	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.5007	51.94
hsl(3, 71%, 55%) rgb(223, 72, 62) #DF483E	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.50059	54.23
hsl(0, 71%, 57%) rgb(224, 70, 70) #E04646	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.50047	55.52
hsl(4, 72%, 55%) rgb(224, 71, 59) #E0473B	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.50042	54.96
hsl(0, 72%, 57%) rgb(225, 69, 67) #E14543	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	56.07
hsl(2, 74%, 56%) rgb(227, 67, 60) #E3433C	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	57.49
hsl(0, 76%, 57%) rgb(229, 64, 62) #E5403E	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	59.34
hsl(0, 81%, 56%) rgb(235, 55, 55) #EB3737	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.50057	65.01
hsl(3, 82%, 54%) rgb(235, 56, 44) #EB382C	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.50092	64.98
hsl(2, 83%, 55%) rgb(236, 54, 46) #EC362E	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.50023	65.99
hsl(0, 84%, 56%) rgb(238, 50, 48) #EE3230	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.50081	68.0
hsl(4, 86%, 53%) rgb(239, 49, 35) #EF3123	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.50027	68.71
hsl(0, 85%, 56%) rgb(239, 48, 47) #EF302F	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.50048	68.99
hsl(4, 87%, 53%) rgb(240, 47, 33) #F02F21	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	69.6
hsl(0, 86%, 55%) rgb(240, 46, 45) #F02E2D	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	69.98
hsl(4, 88%, 53%) rgb(241, 45, 30) #F12D1E	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	70.37
hsl(0, 87%, 55%) rgb(241, 44, 42) #F12C2A	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.50038	70.93
hsl(2, 89%, 53%) rgb(243, 40, 31) #F3281F	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.50071	72.41
hsl(4, 91%, 51%) rgb(244, 38, 20) #F42614	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.50047	72.0
hsl(0, 90%, 54%) rgb(244, 37, 34) #F42522	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.50081	73.53
hsl(3, 91%, 52%) rgb(245, 35, 22) #F52316	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.50094	73.27
hsl(3, 91%, 52%) rgb(245, 35, 21) #F52315	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.50027	73.11
hsl(0, 91%, 54%) rgb(245, 34, 34) #F52222	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	74.41
hsl(3, 92%, 51%) rgb(246, 32, 18) #F62012	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.50042	73.45
hsl(0, 92%, 54%) rgb(246, 31, 31) #F61F1F	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.50081	75.07
hsl(1, 93%, 53%) rgb(247, 28, 24) #F71C18	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	75.17
hsl(4, 94%, 50%) rgb(248, 25, 9) #F81909	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	72.61
hsl(4, 94%, 50%) rgb(248, 25, 8) #F81908	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.50037	72.27
hsl(0, 94%, 53%) rgb(248, 24, 23) #F81817	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	75.65
hsl(0, 94%, 52%) rgb(248, 24, 22) #F81816	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	75.51
hsl(1, 95%, 51%) rgb(249, 20, 14) #F9140E	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.50081	74.45
hsl(1, 95%, 51%) rgb(249, 20, 13) #F9140D	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.50035	74.19
hsl(2, 97%, 49%) rgb(250, 15, 3) #FA0F03	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	70.79
hsl(3, 98%, 49%) rgb(250, 15, 2) #FA0F02	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	70.32
hsl(3, 99%, 49%) rgb(250, 15, 1) #FA0F01	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.50012	69.82
hsl(0, 95%, 51%) rgb(250, 14, 14) #FA0E0E	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	74.33

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 : 51 résultats (2 779 920 couleurs testées)

Produits

Suivez-nous

Langue :

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

Ancien contraste

Nouveau contraste : 51 résultats (2 779 920 couleurs testées)

Produits

Suivez-nous

Langue :

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