Contrast Finder

Contrast-Finder encontra os bons contrastes para a acessibilidade web.

O critèrio de sucesso 1.4.3 das WCAG requer para o texto un rácio de contraste mínimo de 4.5 para fontes normais (e 3 para fontes largas).

Cor em hexadecimal, RGB ou com palavras-chave de cores.
Exemplo : #FFFFFF, rgb(255,255,255) ou white
The contrast of your colours is insufficient.
Current ratio: 1.86

Contraste anterior

Contraste inválido
Primeiro plano Fundo Exemplo Rácio Distância
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(173, 81%, 41%)
  • rgb(19, 191, 173)
  • #13BFAD

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

1.86401

Novo contraste : 32 resultados (988 cores testadas)

Contrastes válidos
Primeiro plano Fundo Exemplo Rácio Distância
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(137, 77%, 3%)
  • rgb(2, 16, 6)
  • #021006

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.51491 215.6
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(133, 68%, 3%)
  • rgb(3, 16, 6)
  • #031006

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.50952 215.59
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(102, 77%, 3%)
  • rgb(6, 16, 2)
  • #061002

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.5007 218.01
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(25, 77%, 3%)
  • rgb(16, 8, 2)
  • #100802

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.60749 223.26
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(27, 68%, 3%)
  • rgb(16, 9, 3)
  • #100903

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.58676 222.0
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(27, 52%, 4%)
  • rgb(16, 10, 5)
  • #100A05

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.56434 220.16
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(30, 45%, 4%)
  • rgb(16, 11, 6)
  • #100B06

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.54352 218.9
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(22, 33%, 4%)
  • rgb(16, 11, 8)
  • #100B08

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.53981 217.75
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(25, 28%, 4%)
  • rgb(16, 12, 9)
  • #100C09

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.5181 216.49
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(214, 77%, 3%)
  • rgb(2, 8, 16)
  • #020810

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.66413 215.47
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(212, 68%, 3%)
  • rgb(3, 9, 16)
  • #030910

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.63912 214.74
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(212, 52%, 4%)
  • rgb(5, 10, 16)
  • #050A10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.60875 214.01
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(210, 45%, 4%)
  • rgb(6, 11, 16)
  • #060B10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.58385 213.3
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(217, 33%, 4%)
  • rgb(8, 11, 16)
  • #080B10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.57275 213.29
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(214, 28%, 4%)
  • rgb(9, 12, 16)
  • #090C10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.5471 212.58
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(215, 18%, 5%)
  • rgb(11, 13, 16)
  • #0B0D10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.51511 211.87
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(244, 82%, 8%)
  • rgb(7, 4, 41)
  • #070429

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.6041 206.78
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(243, 67%, 9%)
  • rgb(10, 8, 41)
  • #0A0829

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.51353 203.51
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(245, 52%, 4%)
  • rgb(6, 5, 16)
  • #060510

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.6995 217.63
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(246, 45%, 4%)
  • rgb(7, 6, 16)
  • #070610

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.67411 216.89
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(240, 33%, 4%)
  • rgb(8, 8, 16)
  • #080810

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.62982 215.44
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(240, 28%, 4%)
  • rgb(9, 9, 16)
  • #090910

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.60517 214.72
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(240, 18%, 5%)
  • rgb(11, 11, 16)
  • #0B0B10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.55606 213.28
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(240, 14%, 5%)
  • rgb(12, 12, 16)
  • #0C0C10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.53012 212.57
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(278, 77%, 3%)
  • rgb(11, 2, 16)
  • #0B0210

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.72932 219.82
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(276, 68%, 3%)
  • rgb(11, 3, 16)
  • #0B0310

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.70948 219.08
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(278, 52%, 4%)
  • rgb(12, 5, 16)
  • #0C0510

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.66401 217.61
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(276, 45%, 4%)
  • rgb(12, 6, 16)
  • #0C0610

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.64471 216.88
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(277, 33%, 4%)
  • rgb(13, 8, 16)
  • #0D0810

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.60015 215.43
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(282, 28%, 4%)
  • rgb(14, 9, 16)
  • #0E0910

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.57467 214.71
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(276, 18%, 5%)
  • rgb(14, 11, 16)
  • #0E0B10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.53721 213.28
  • hsl(120, 32%, 40%)
  • rgb(70, 136, 71)
  • #468847
  • hsl(270, 14%, 5%)
  • rgb(14, 12, 16)
  • #0E0C10

Título Grande com palavras em negrito

Este é um texto de exemplo com algumas palavras em negrito para ilustrar o contraste correto.

4.51736 212.57
Não satisfeito?
Propõe-me cores válidas e muito próximas da cor original