12 Tons diferentes de Cinza (+ códigos HEX)
Explore todos os tons de cinza, dos mais claros aos mais escuros. Veja os códigos HEX, os nomes dos tons e paletas de cores cinza. Clique em qualquer tom para copiar o código.
O cinza é o chão onde o resto da paleta se apoia. A decisão que importa é a temperatura: um cinza com azul parece técnico, um com marrom parece humano.
Nunca use texto cinza médio sobre fundo cinza claro — é a falha de acessibilidade mais comum que existe.
- wild sand#f5f5f5
- mercury#e9e9e9
- alto#dcdcdc
- silver#c4c4c4
- silver chalice#acacac
- gray#939393
- boulder#7b7b7b
- dove gray#6e6e6e
- scorpion#565656
- tundora#4a4a4a
- mine shaft#3e3e3e
- cod gray#191919
Cinza: códigos HEX e RGB
cinza tem os seguintes códigos de cor principais:
HEX: #f5f5f5
RGB: (245, 245, 245).
Explore uma ampla gama de tons de cinza no seletor interativo. Clique em qualquer cor para copiar o código HEX e usar no seu projeto!
Explore os tons mais claros de cinza
Wild Sand
#f5f5f5
Wild Sand
#f5f5f5
Wild Sand
#f7f7f7
Wild Sand
#f7f7f7
Alabaster
#fafafa
Alabaster
#fafafa
Alabaster
#fafafa
Alabaster
#fcfcfc
Alabaster
#fcfcfc
White
#ffffff
Explore os tons mais escuros de cinza
Aubergine
#330a0a
Cedar
#4b1616
Buccaneer
#622727
Lotus
#7b3d3d
Au Chico
#935858
Pharlap
#ab7878
Quicksand
#c49c9c
Wafer
#ddc6c6
cinza em HEX, RGB, HSL e CMYK
| HEX | #808080 | |
|---|---|---|
| RGB | rgb(128, 128, 128) | |
| HSL | hsl(0, 0%, 50%) | |
| CMYK | cmyk(0%, 0%, 0%, 50%) |
Tons claros e escuros de cinza
Os tons claros somam branco e os escuros somam preto, sem mudar o matiz. Servem para estados hover, bordas e fundos que precisam continuar sendo da mesma cor.
Mais claros
#939393
#a7a7a7
#bababa
#cecece
#e1e1e1
#f5f5f5
Mais escuros
#6c6c6c
#585858
#454545
#313131
#1e1e1e
#0a0a0a
Cores que combinam com cinza
Complementar
#808080 #808080
O oposto no círculo cromático. Contraste máximo: use como acento, não em meia página.
Análogas
#808080 #808080 #808080
Vizinhas no círculo. Calmas e coerentes, o jeito mais seguro de montar uma paleta.
Tríade
#808080 #808080 #808080
Três cores igualmente espaçadas. Vivas e equilibradas; deixe uma delas dominar.
Texto sobre cinza
Medido pelas WCAG: 4.5:1 para texto normal e 3:1 para texto grande. Teste a sua própria combinação no Verificador de contraste
Tabela de tons de cinza
Clique com o botão direito para salvar a tabela, ou copie os códigos acima.