Crie um fundo de qualquer cor uniforme
Ecrã de Cor Personalizada
Introduza um valor HEX de seis caracteres ou escolha uma cor visualmente. Abra-a em ecrã inteiro, compare-a com a escolha anterior e exporte um PNG correspondente. A ferramenta mantém a cor selecionada visível e mostra os respetivos valores HEX, RGB e HSL.
- Entrada
- Seletor ou HEX de seis caracteres
- Valores mostrados
- HEX, RGB, HSL e brilho calculado
- Histórico
- Quatro cores recentes no navegador
- Imagem máxima
- 7680 × 4320
Como criar um ecrã de cor personalizada
Comece com um valor conhecido quando a exatidão importa ou explore visualmente se estiver a escolher o ambiente.
Introduza a cor
Escreva um valor como #3AB0A2, use o seletor ou recolha uma cor com o conta-gotas quando o navegador permitir.
Examine os valores
Veja os valores RGB e HSL, o brilho calculado e a sugestão de cor de texto com maior contraste.
Compare as opções
Escolha outra cor e ative Comparar A/B para a colocar ao lado da seleção anterior.
Use ou guarde
Abra o fundo em ecrã inteiro ou descarregue um PNG uniforme com as dimensões necessárias.
Use o mesmo valor no design e no ecrã
Um código HEX dá uma referência digital clara a quem trabalha consigo. Copie RGB para os controlos de imagem ou de aplicações e HSL quando preferir ajustar o tom, a saturação e a luminosidade em separado.
O ecrã é uma pré-visualização, não uma prova de que todos os dispositivos reproduzem o valor da mesma forma. O tipo de painel, as definições de cor, o brilho e a luz da divisão podem alterar o aspeto.
Uma forma prática de comparar cores
Defina a primeira opção, escolha a segunda e abra Comparar A/B. Observe ambas ao mesmo tempo, em vez de confiar na memória da cor. Veja o valor de contraste antes de colocar texto sobre o fundo.
Quando precisar de uma referência neutra, compare a escolha com preto puro ou um fundo branco. Estas páginas também oferecem predefinições próprias para inspeção e iluminação.
O que fazem os controlos de cor
As definições abrangem a seleção, a comparação, o comportamento do navegador e a criação de ficheiros.
Predefinições personalizadas
Depois de escolher uma cor, a ferramenta cria versões original, reduzida, escura e clara a partir desse valor.
Brilho e texto
LUM mostra o brilho relativo calculado que se usa nas verificações de acessibilidade Web. TEXT indica se preto ou branco oferece maior contraste.
Cores recentes
Até quatro cores válidas ficam guardadas localmente para poder retomar escolhas recentes.
Ajustar ao meu ecrã
A imagem usa as dimensões indicadas pelo navegador. Também considera a proporção de píxeis: o número de píxeis físicos usado para uma unidade do ecrã.
Importante: A indicação de contraste é um cálculo para texto preto ou branco. Verifique a interface completa de acordo com os requisitos de acessibilidade do seu projeto.
Perguntas sobre Ecrã de Cor Personalizada
Que formatos HEX são aceites?
Introduza um cardinal seguido de seis caracteres hexadecimais, por exemplo #1A2B3C.
As cores recentes são enviadas para um servidor?
Não. A lista recente fica no armazenamento local do navegador, neste dispositivo.
A ferramenta pode calibrar o monitor?
Não. Mostra as cores pedidas no navegador, mas não consegue medir nem corrigir a luz física emitida pelo painel.