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, 100%, 34%) rgb(174, 0, 0) #AE0000	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.14676

Nouveau contraste : 30 résultats (2 365 440 couleurs testées)

Contrastes valides
Avant plan	Arrière plan	Exemple	Ratio	Distance
hsl(3, 51%, 60%) rgb(206, 106, 100) #CE6A64	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	130.53
hsl(1, 52%, 60%) rgb(207, 105, 103) #CF6967	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	131.74
hsl(3, 57%, 60%) rgb(212, 102, 96) #D46660	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50007	126.01
hsl(1, 60%, 60%) rgb(216, 99, 95) #D8635F	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50077	123.89
hsl(0, 61%, 61%) rgb(217, 98, 97) #D96261	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50097	124.58
hsl(4, 63%, 60%) rgb(218, 98, 88) #DA6258	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50024	119.53
hsl(3, 64%, 60%) rgb(219, 97, 90) #DB615A	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50058	120.11
hsl(0, 65%, 61%) rgb(221, 95, 93) #DD5F5D	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	120.86
hsl(3, 68%, 60%) rgb(223, 94, 85) #DF5E55	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50083	116.04
hsl(3, 69%, 60%) rgb(224, 93, 86) #E05D56	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50062	116.11
hsl(2, 69%, 61%) rgb(225, 92, 87) #E15C57	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	116.22
hsl(0, 71%, 61%) rgb(227, 90, 88) #E35A58	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	115.96
hsl(3, 77%, 60%) rgb(232, 86, 77) #E8564D	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	108.79
hsl(3, 81%, 60%) rgb(236, 82, 73) #EC5249	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	105.63
hsl(3, 82%, 60%) rgb(237, 81, 71) #ED5147	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50007	104.45
hsl(3, 83%, 60%) rgb(238, 80, 69) #EE5045	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	103.31
hsl(0, 83%, 62%) rgb(239, 78, 78) #EF4E4E	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50088	106.96
hsl(4, 84%, 60%) rgb(239, 79, 67) #EF4F43	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50063	102.23
hsl(4, 85%, 59%) rgb(240, 78, 64) #F04E40	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50006	100.8
hsl(2, 88%, 60%) rgb(243, 74, 66) #F34A42	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	100.7
hsl(3, 89%, 60%) rgb(244, 73, 62) #F4493E	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	99.0
hsl(0, 89%, 61%) rgb(245, 71, 69) #F54745	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50074	101.46
hsl(3, 92%, 60%) rgb(247, 69, 59) #F7453B	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50036	97.36
hsl(4, 93%, 59%) rgb(248, 68, 53) #F84435	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	95.41
hsl(0, 94%, 61%) rgb(250, 64, 63) #FA403F	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	98.34
hsl(2, 96%, 60%) rgb(251, 63, 56) #FB3F38	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	95.91
hsl(0, 96%, 60%) rgb(252, 61, 59) #FC3D3B	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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	96.8
hsl(4, 97%, 58%) rgb(252, 62, 47) #FC3E2F	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50032	93.47
hsl(2, 98%, 59%) rgb(253, 60, 50) #FD3C32	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50013	94.13
hsl(1, 99%, 60%) rgb(254, 58, 52) #FE3A34	hsl(0, 0%, 12%) rgb(33, 33, 33) #212121	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.50016	94.64

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 : 30 résultats (2 365 440 couleurs testées)

Produits

Suivez-nous

Langue :

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

Ancien contraste

Nouveau contraste : 30 résultats (2 365 440 couleurs testées)

Produits

Suivez-nous

Langue :

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