Seletor/Conversor de Cores
Escolha cores e converta entre diferentes formatos
Correspondências Alternativas:
Visualizar aparência do texto
The quick brown fox jumps over the lazy dog
color: #6366f1; background-color: #6366f1; border-color: #6366f1;
Sobre Formatos de Cores
As cores podem ser representadas em muitos formatos diferentes, cada um com seus casos de uso específicos e vantagens. Esta ferramenta suporta conversão entre os formatos de cores mais comumente usados.
Compreender diferentes modelos de cores é essencial para desenvolvimento web, design de UI e criação de arte digital.
Formatos de Cores Suportados
#RRGGBB
0-255, 0-255, 0-255
0°-360°, 0-100%, 0-100%
0°-360°, 0-100%, 0-100%
0-100%, ×4
16-235, 16-240, 16-240
L*: 0-100, a*/b*: -128 to +127
Detalhes do Formato de Cor
HEX (Hexadecimal)
Cores HEX usam uma notação hexadecimal de 6 dígitos precedida por #. Cada par representa valores de Vermelho, Verde e Azul (00-FF). A notação curta (#RGB) expande para #RRGGBB. Suporta formato de 8 dígitos para transparência alfa (#RRGGBBAA).
Uso: CSS, HTML, web design, a maioria das linguagens de programação
RGB (Vermelho, Verde, Azul)
O modelo RGB é um modelo de cor aditivo onde a luz vermelha, verde e azul são combinadas para criar cores. Este modelo mapeia diretamente como as telas emitem luz, tornando-o o espaço de cor nativo para exibições digitais.
Uso: Exibições de tela, iluminação LED, CSS, imagem digital
HSL (Matiz, Saturação, Luminosidade)
HSL representa cores em termos de percepção humana. Matiz é o ângulo da cor em uma roda de cores, Saturação é a intensidade, e Luminosidade é quão clara ou escura é a cor. Isso torna a manipulação de cores mais intuitiva.
Uso: CSS, geração de esquema de cores, seleção intuitiva de cores
HSV/HSB (Matiz, Saturação, Valor/Brilho)
HSV (também chamado HSB) é semelhante ao HSL, mas usa Valor em vez de Luminosidade. Valor representa o brilho onde 100% é o mais brilhante. Este modelo é preferido em muitas aplicações gráficas, pois se alinha melhor com como os artistas pensam sobre cores.
Uso: Photoshop, GIMP, seletores de cores em software gráfico
CMYK (Ciano, Magenta, Amarelo, Chave/Preto)
CMYK é um modelo de cor subtrativo usado na impressão. Ao contrário do RGB que adiciona luz, o CMYK subtrai luz do papel branco. O 'K' significa Chave (preto) para melhorar a qualidade de impressão e reduzir o uso de tinta.
Uso: Design de impressão, impressão comercial, embalagens
YCbCr (Luminância, Crominância)
YCbCr separa os componentes de luma (Y) de croma (Cb, Cr). Esta separação permite compressão eficiente de vídeo porque os olhos humanos são mais sensíveis ao brilho do que à cor. Comumente usado em JPEG, MPEG e padrões de transmissão.
Uso: Compressão JPEG, codificação de vídeo (H.264, HEVC), transmissão de TV
Lab (CIE L*a*b*)
Lab é um espaço de cores perceptualmente uniforme projetado para aproximar a visão humana. L* representa luminosidade, a* o eixo verde-vermelho, e b* o eixo azul-amarelo. Uma distância perceptual de 1 unidade parece aproximadamente a mesma, independentemente da cor.
Uso: Ciência das cores, cálculo de diferença de cores (Delta E), gerenciamento profissional de cores
Pantone (PMS)
Pantone Matching System (PMS) é um sistema proprietário de padronização de cores amplamente usado em impressão, moda e design de produtos. Cada cor tem um código único garantindo reprodução consistente em diferentes materiais e fabricantes.
Uso: Identidade de marca, impressão comercial, design de embalagens, indústria têxtil
Nota: Estas são representações digitais aproximadas. As cores Pantone reais podem variar na impressão.
Fundamentos da Teoria das Cores
As cores existem em diferentes 'espaços' otimizados para diferentes propósitos. Modelos aditivos (RGB) funcionam adicionando luz, enquanto modelos subtrativos (CMYK) funcionam absorvendo luz. Modelos perceptuais (Lab) se alinham com a visão humana.
Modelo de Cor Aditivo
RGB combina luz vermelha, verde e azul. Adicionar todos os três em intensidade total cria branco. É assim que telas, projetores e displays digitais funcionam.
Modelo de Cor Subtrativo
CMYK absorve (subtrai) comprimentos de onda de luz do branco. Combinar todas as cores cria preto (em teoria). É assim que tintas e pinturas funcionam.
Modelo de Cor Perceptual
Lab e espaços semelhantes são projetados em torno da percepção humana, tornando-os ideais para comparação e correção de cores.
Notas de Conversão
- RGB ↔ HEX: Conversão sem perdas, apenas mudança de formato
- RGB ↔ HSL/HSV: Sem perdas dentro do gamut, pode perder precisão
- RGB ↔ CMYK: Pode perder cores fora do gamut de impressão
- RGB ↔ Lab: Usa iluminante D65, espaço de cor sRGB assumido
- RGB ↔ YCbCr: Usa padrão BT.601 por padrão
Padrões de Contraste WCAG
As Diretrizes de Acessibilidade de Conteúdo Web (WCAG) definem requisitos mínimos de contraste entre texto e fundo para garantir que todos os usuários, incluindo aqueles com deficiências visuais, possam ler o conteúdo.