Color Theory

Luminosidade

A quantidade percebida de luz refletida por uma cor, variando de preto (0%) a branco (100%).

Lightness is a perceptual measurement that indicates how light or dark a color appears. In the HSL model, lightness is the third component measured as a percentage, where 0% is pure black, 50% is the pure hue, and 100% is pure white. Lightness differs from brightness (used in HSV/HSB) in that maximum lightness always produces white regardless of saturation. In the CIELAB color space, the L* axis represents perceptual lightness, designed to be more uniform with human perception than HSL lightness.

Experimente

Conversor de cores

Converta entre os formatos de cor HEX, RGB, HSL, HSV, CMYK e OKLCH instantaneamente.

Gerador de tons

Gere escalas de tons estilo Tailwind CSS (50–950) a partir de qualquer cor base para sistemas de design.

Artigos relacionados

CSS color-mix(): Misture Cores Nativamente no Navegador

Aprenda CSS color-mix() para misturar cores nativamente no navegador. Domine a sintaxe, espaços de cores, casos de uso práticos e crie paletas dinâmicas sem JavaScript.

Criando um Seletor de Cores como Web Component do Zero

Crie um seletor de cores acessível como Web Component. Implemente renderização em canvas, sliders de matiz, canais alfa e eventos customizados com Shadow DOM.

Espaços de Cor Perceptuais: Lab, LCH, Oklab, OKLCH

Explore espaços de cor perceptualmente uniformes — CIE Lab, LCH, Oklab e OKLCH. Aprenda como cada um foi projetado, onde se destaca e qual usar para CSS e trabalho de design.

Estampagem a Foil e Cores Metálicas no Design Gráfico

Aprenda sobre técnicas de estampagem a foil, opções de tinta metálica, escolhas de foil dourado e prateado e considerações de design para materiais impressos premium.

Cor para Contar Histórias com Dados: Além das Paletas Padrão

Vá além das cores padrão de gráficos para narrar histórias com dados. Aprenda paletas sequenciais, divergentes e categóricas, acessibilidade em dataviz e escalas de cores em D3/Chart.js.

Esmeralda vs Jade vs Verde Floresta: Guia de Comparação de Verdes

Compare esmeralda (#50C878), jade (#00A86B) e verde floresta (#228B22). Conheça as diferenças visuais e os códigos hex entre essas populares tonalidades de verde.