Guia de Cores CSS

Copia e cola o código da cor CSS que precisas para o teu design UI ou para o teu código frontend.

Como funciona

Explora paletas por matiz, saturação, luminosidade e estado de espírito (quente, frio, pastel, vibrante…). Cada cor mostra o código HEX, RGB, HSL e OKLCH, e podes copiá-lo com um clique para colar no Tailwind, CSS, Figma ou qualquer ferramenta de design.

Formatos suportados

HEX (#ff5733), RGB (rgb 255 87 51), HSL (hsl 11 100% 60%) e OKLCH — o formato moderno do CSS Color Module Level 4 que respeita a perceção visual da cor.

Vantagens

Tudo local: nada enviado para servidores. Copy-paste instantâneo. Filtros HSL para restringir por tom, saturação ou brilho. Categorização por mood para encontrar paletas alinhadas com a personalidade da tua marca.

Perguntas frequentes

O que é OKLCH e porquê usá-lo?

OKLCH é um espaço de cor percetualmente uniforme do CSS Color Module Level 4. Alterar a luminosidade mantém o matiz percebido — algo que o HSL não consegue.

Posso usar estas cores comercialmente?

Sim. São valores de cor, não há copyright sobre um HEX.

Outras ferramentas