Insights do código de cor #B6B8E2

Todas as conversões, harmonias e verificações de acessibilidade de que você precisa para projetar com confiança.

RGB:rgb(182, 184, 226)
HSL:hsl(237, 43%, 80%)
Selecione uma cor da imagemSelecionador de cores
HEX
#B6B8E2
RGB
182, 184, 226
HSL
237°, 43%, 80%
HSV
237°, 19%, 89%
CMYK
19%, 19%, 0%, 11%

Conversão de Cores

Gere valores em vários modelos de cores num só lugar.

#B6B8E2

≈ Azul Aço

Cartões de cores de referência

Um ΔE mais baixo significa uma correspondência visual mais próxima

Matizes e sombras

Explore como #B6B8E2 se comporta quando misturada com branco ou preto. Estas amostras são perfeitas para estados de hover, sombras e fundos.

Passe o mouse para copiar qualquer valor hexadecimal e reutilizá-lo em sua interface.

Sombras

0–100%
0%#B6B8E2
10%#999CD6
20%#7C80CB
30%#5F63BF
40%#464BAF
50%#3A3F92
60%#2F3275
70%#232658
80%#17193A
90%#0C0D1D
100%#000000

Matizes

0–100%
0%#B6B8E2
10%#BDBFE5
20%#C5C6E8
30%#CCCDEB
40%#D3D5EE
50%#DBDCF0
60%#E2E3F3
70%#E9EAF6
80%#F0F1F9
90%#F8F8FC
100%#FFFFFF

Casos de uso comuns

  • Estados de componentes de UI (hover, ativo, desativado)
  • Criação de profundidade com sombras e destaques
  • Construção de sistemas de cores consistentes

Sistema de design

Dica de sistema de design

Estas variações formam a base de uma paleta coesa. Exporte-as para manter marketing, produto e engenharia alinhados.

Exportar paleta

Harmonias de cores

Crie paletas equilibradas instantaneamente com harmonias geradas a partir de #B6B8E2.

Clique em qualquer amostra para abrir sua página de detalhes e continuar explorando.

Como usar

Escolha uma cor dominante e, em seguida, deixe que as tonalidades de suporte atuem como acentos para tipografia, superfícies e botões de chamada para ação.

Por que é importante

Harmonias equilibradas comunicam intenção — calma, energética, premium — sem sobrecarregar seu layout.

Complementar

Tonalidades opostas que criam impacto e contraste ousado.

Melhor para

CTAs de alto impacto, logotipos e seções hero

Análoga

Tonalidades vizinhas para gradientes naturais e fluidos.

Melhor para

Dashboards calmantes, inspirados na natureza

Triádica

Três tonalidades uniformemente espaçadas para um equilíbrio divertido.

Melhor para

Branding divertido e layouts editoriais

Tetrádica

Dois pares complementares que oferecem rica variedade.

Melhor para

Ilustrações e experimentos de marketing

Monocromática

Irmãos mais claros e mais escuros dentro da mesma família de tonalidades.

Melhor para

Interfaces minimalistas e estados de UI premium

Contraste de acessibilidade

Verifique a legibilidade de #B6B8E2 com cores de texto comuns para que cada visitante desfrute de uma experiência clara.

Use AA como linha de base para o corpo do texto e AAA para acessibilidade premium.

Texto de exemplo em texto preto
Cor do texto#000000
Fundo#B6B8E2
Taxa de contraste10.94:1
Nível WCAGAAA
Texto de exemplo em texto branco
Cor do texto#FFFFFF
Fundo#B6B8E2
Taxa de contraste1.92:1
Nível WCAGFail
Pré-visualização de texto recomendada
Cor do texto#000000
Fundo#B6B8E2
Taxa de contraste10.94:1
Nível WCAGAAA

Formatos Técnicos

Desbloqueie espaços de cores profissionais como XYZ, LAB, variantes CMYK e perfis prontos para exportação.

Registe-se gratuitamente

Formatos Práticos

Obtenha simulações de impressão, mapeamentos de LED e ordens de bytes prontas para desenvolvedores.

Registe-se gratuitamente

Análise de Cores

Mergulhe em dados espectrais, relatórios de dominância e análises avançadas.

Registe-se gratuitamente

Simulador de Daltonismo

Pré-visualize como #B6B8E2 aparece em deficiências comuns de visão de cores.

Registe-se gratuitamente

Aspetos Criativos

Explore associações sazonais, sinais emocionais e ocorrências naturais.

Registe-se gratuitamente

Orientação de design

Equilíbrio

Trate #B6B8E2 como um destaque. Combine-a com neutros e uma tonalidade de suporte para evitar sobrecarga visual.

Contraste

Teste combinações com conteúdo real. Um contraste mais alto melhora a digitalização, a legibilidade e as conversões.

Harmonia

Use matizes mais claros para superfícies, a cor base para primárias e sombras mais escuras para estados de hover ou pressionado.

Precisa de outra cor?

Volte para o seletor de cores para carregar imagens, gerar paletas e explorar novas relações de cores.

Abrir seletor de cores