Ir para o conteúdo principal

Preto

Tudo o que você precisa saber sobre preto para inspirar seu próximo design.

Obter paleta de cores

Escolha uma cor

Hex

RGB

HSB

HSL

Escolha as configurações da paleta

Paletas personalizadas

Preto, com o código Hex #000000, é a forma mais pura e absoluta de preto, representando a completa ausência de luz e cor. Frequentemente associado à formalidade e mistério, o preto é uma cor poderosa e versátil no design, eficaz para criar profundidade, contraste e destaque.

color pretocolor preto

O preto é definido pelos seguintes códigos e valores de cor para garantir consistência em várias plataformas e dispositivos digitais.

- Código HEX: #000000

- Valor RGB: 0% vermelho, 0% verde e 0% azul

A escolha de cores no design de UX e UI deve considerar critérios de acessibilidade, que são fundamentais. O Figma oferece plugins na Comunidade para garantir que seus designs atendam às Diretrizes de Acessibilidade de Conteúdo da Web.

O preto pode melhorar a estética e a funcionalidade do design de UI. Aqui estão algumas maneiras eficazes de incorporá-lo:

  • Enfatize o minimalismo. Fundos ou elementos pretos podem acentuar um design minimalista, fazendo o conteúdo se destacar enquanto mantém a interface elegante e profissional. Essa abordagem funciona excepcionalmente bem em designs de "modo escuro", reduzindo a fadiga ocular em condições de pouca luz e prolongando a vida útil da bateria em telas OLED.
  • Apoie a acessibilidade. Sempre confirme que o uso do preto apoia os padrões de acessibilidade. O contraste adequado com outras cores, especialmente para texto, é essencial para usuários com deficiências visuais.
  • Equilibre com cor. Enquanto o preto pode dominar, ele também é uma cor de base quando equilibrado com cores mais vibrantes para vivacidade ou tons mais suaves para uma estética mais sutil. Use o preto como base para fazer outras cores da sua paleta se destacarem.
  • Transmita elegância e sofisticação. O preto é sinônimo de luxo e sofisticação. Use-o em elementos de UI como cabeçalhos, rodapés ou acentos tipográficos para adicionar um toque de elegância aos seus designs.

Dica: Ao projetar para um público global, pesquise o simbolismo da cor em diferentes culturas — o vermelho não significa o mesmo em todos os lugares.

Para variações dentro do mesmo espectro profundo e enigmático do preto, considere:

  • Cinza carvão (#4A4A4A) oferece um tom ligeiramente mais claro que mantém a força e o mistério do preto, proporcionando uma alternativa mais suave para versatilidade.
  • Ônix (#353839) reflete a essência profunda e escura do preto com um toque de azul, dando uma sensação ligeiramente dimensional ao preto sólido.
  • Gunmetal (#353E43) apresenta uma borda metálica, misturando a profundidade do preto com um brilho de cinza para textura e interesse visual adicionais.
  • Ébano (#5D6658) introduz um sutil tom verde, criando um tom escuro e rico que ecoa a profundidade e complexidade natural do preto.

Para complementar os tons definitivos do preto, considere combiná-lo com:

  • Branco (#FFFFFF) para um contraste clássico e atemporal que aguça e eleva a profundidade do preto.
  • Prata (#C4C4C4) adiciona um toque futurista e elegante, iluminando a base sofisticada que o preto proporciona.
  • Ouro (#EFBF04) introduz um contraste luxuoso e opulento, fazendo da profundidade do preto um pano de fundo para calor e esplendor.
  • Azul real (#305CDE) traz um toque vibrante de cor, oferecendo um contraste régio e dinâmico à austeridade do preto.
  • Bordô (#660033) combina calor e profundidade, criando uma paleta refinada e luxuosa que harmoniza lindamente com o preto.

Outras cores que valem a pena considerar incluem verde oliva para uma mistura terrosa e sutil; coral para um contraste brilhante e energético, e rosa suave para um toque delicado e feminino.

Embora o preto seja excepcionalmente versátil, certas combinações podem ser menos harmoniosas:

  • Cores neon (por exemplo, #FF00FF) podem oferecer um contraste muito acentuado, potencialmente chocando com a sofisticação inerente do preto ao criar uma paleta excessivamente vibrante.
  • Marrons escuros (#654321), quando usados em excesso, podem turvar a clareza e nitidez do preto, levando a uma combinação visualmente pesada e menos distinta.
  • Roxos profundos (#4B0082), sem um emparelhamento cuidadoso, podem competir com a dominância do preto, arriscando uma paleta que parece excessivamente sombria ou monótona.
  • Verdes escuros (#006400) em tons saturados podem se misturar muito de perto com o preto, diminuindo o potencial para uma paleta dinâmica ou visualmente envolvente.
  • Azuis muito escuros (#00008B), semelhantes aos verdes escuros, podem não fornecer contraste ou variação suficientes, resultando em uma mistura que carece de distinção.

O preto pode representar poder, elegância e formalidade — pense em um evento de gala ou no icônico Vestido Preto, o epítome da sofisticação e estilo. Mesmo na psicologia das cores, o preto é visto como uma cor de força, autoridade e profundidade.

Mas essa não é toda a história: em muitas culturas, o preto está associado ao luto e à solenidade, representando perda e a natureza finita da vida. A capacidade do preto de absorver toda a luz o torna um símbolo do desconhecido, do mistério e do infinito, evocando um humor contemplativo e um senso de potencial e possibilidade.

A capacidade do preto de criar contraste, foco e descanso visual fala de seu poder no design de UX/UI. Sua aplicação em interfaces digitais, desde o design minimalista elegante até a praticidade das configurações de modo escuro, demonstra sua versatilidade. Os designers podem usá-lo para transmitir uma sensação de confiabilidade e sofisticação, especialmente para produtos de luxo e serviços de alto padrão.

Desde pinturas rupestres antigas até a mitologia, o preto representou as dualidades da vida e da morte ao longo da história. Durante o século 14, o preto tornou-se associado ao poder e à rebeldia na moda europeia. A era vitoriana o abraçou para trajes de luto. Durante a Revolução Industrial, o preto era a cor da fuligem e da fumaça das máquinas, simbolizando progresso e avanço tecnológico.

No século 20, o Vestido Preto desenhado por Chanel imortalizou a elegância e simplicidade do preto, democratizando a moda com seu estilo e sofisticação. Hoje, materiais como o Vantablack expandiram os limites da percepção do preto, casando ciência com arte para explorar novos mundos.

Variações de cor

Sombras

Tonalidades

Tons

Matizes

Harmonias de cores

Complementar

Dividida

Monocromática

Análoga

Triádica

Quadrado

Paletas personalizadas

Abismo Negro

Noir Gótico

Grafite

Verificador de contraste

Contraste 21

Texto grande

#000000

Texto normal

Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.

Este é um texto #000000 sobre fundo #FFFFFF.
Categoria
Aprovado
Aprovado
Aprovado
Aprovado
Aprovado
Aprovado

Contraste 1

Texto grande

#000000

Texto normal

Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.

Este é um texto #000000 sobre fundo #000000.
Categoria
Reprovado
Reprovado
Reprovado
Reprovado
Reprovado
Reprovado

Simulações de cor

Protanopia

Deuteranopia

Tritanopia

Acromatopsia

A cor hexadecimal #000000, conhecida como preto, tem valores RGB de R:0, G:0, B:0 e valores CMYK de C:0, M:0, Y:0, K:100.

VALUECSS
HEX#000000#000000
RGB DECIMAL0, 0, 0RGB(0,0,0)
RGB PERCENTAGE0.0, 0.0, 0.0RGB(0.0%,0.0%,0.0%)
CMYK0, 0, 0, 100
HSLHSL(0.0, 0.0%, 0.0%)HSL(0.0, 0.0%, 0.0%)
HSV (OR HSB)0.0°, 0.0, 0.0
WEB SAFE#000#000
BINARY00000000, 00000000, 00000000
iOS - SwiftUIColor(red: 0.000, green: 0.000, blue: 0.000)
iOS - UIKitUIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)
Android - ComposeColor(0xFF000000)
Obter paleta de cores