Paleta de Cores

Cor azul-claro

Azul suave e luminoso que no CSS se chama lightblue. É tranquilo e limpo. Aparece em fundos, roupas de verão e ambientes que querem parecer mais amplos.

Azul-claro · #ADD8E6

Sobre a cor azul-claro

O azul-claro (#ADD8E6) é uma cor fria, clara e de saturação média. Faz parte da família dos azuis. É formada por 173 de vermelho, 216 de verde e 230 de azul (de 0 a 255). É usada principalmente em web, decoração, infantil.

Tons de azul-claro: claros e escuros

Do mais claro ao mais escuro. Toque em um tom para copiar o código.

Harmonias da cor azul-claro

Combinações baseadas no círculo cromático. Veja mais em harmonia de cores.

ComplementarPróximo de: Rosa-bebê
AnálogasPróximo de: Turquesa pastel, Lilás pastel
TríadePróximo de: Lilás, Baunilha
Complementar divididaPróximo de: Rosé, Trigo
TétradePróximo de: Glicínia, Rosa-bebê, Verde-pistache

Paletas com a cor azul-claro

Copie os códigos ou abra a paleta no editor para ajustá-la.

Paleta monocromática · Azul-claro
Paleta análoga · Azul-claro
Paleta complementar · Azul-claro
Paleta tríade · Azul-claro
Paleta com neutros · Azul-claro
Paleta com destaque · Azul-claro

Contraste de azul-claro com texto

Texto brancoContraste 1.5:1 · Não recomendado
Texto pretoContraste 13.7:1 · AAA

Segundo as diretrizes WCAG 2.1. Teste outras combinações no verificador de contraste.

Código CSS

:root {
  --azul-claro: #ADD8E6;
  --azul-claro-rgb: 173, 216, 230;
}
.fundo { background-color: var(--azul-claro); }
.texto { color: var(--azul-claro); }

Cores parecidas com azul-claro

Azul pastelAzul-celesteTurquesa pastelAzul-bebêCinza-claroCinza-pérolaPrataCinza-esverdeadoPlatinaBranco-fumaça

Paletas temáticas com esta cor

Paletas de cores para formaturaPaletas de cores para InstagramPaletas de cores para cozinhaPaletas de cores para sala de estarPaletas de cores aestheticPaletas de cores de verão

Mais azuis

AzulAzul-marinhoAzul-celesteAzul-cobaltoAzul-safiraAzul-açoAzul-royalAzul-elétricoAzul-meia-noiteAzul-ultramarAzul-francêsAzul-da-prússiaAzul pastelAzul-bebêAzul-jeansAzul KleinAzul-escuroAzul-cerúleo

Perguntas frequentes

Qual é o código da cor azul-claro?

O código HEX da cor azul-claro é #ADD8E6. Em RGB é rgb(173, 216, 230), em HSL é hsl(195, 53%, 79%) e em CMYK é 25, 6, 0, 10.

Qual é a cor complementar de azul-claro?

A complementar no círculo cromático é #E6BBAD, um tom próximo de rosa-bebê. Em pequenas doses, funciona como cor de destaque e cria bastante contraste.

Dá para usar texto branco sobre a cor azul-claro?

Melhor usar texto preto: o contraste com o branco é só 1.5:1, enquanto com o preto é 13.7:1.