O cobre é um tom quente de laranja-marrom com qualidades fortes e reconfortantes. Está posicionado na seção vermelho-laranja da roda de cores, exalando uma sensação de durabilidade e energia, enquanto mantém uma vibração terrosa e equilibrada.

O cobre é definido pelos seguintes códigos e valores de cor para garantir consistência em várias plataformas e dispositivos digitais.
- Código HEX: #C68346
- Valor RGB: 77,6% vermelho, 51,4% verde e 27,5% azul
Considerações de acessibilidade desempenham um papel crucial na escolha de cores no design de UX e UI. O Figma oferece plugins na Comunidade para garantir que seus designs atendam às Diretrizes de Acessibilidade de Conteúdo da Web.
Aqui estão algumas maneiras de usar o cobre em seus designs:
- Adicione calor e profundidade. O brilho dourado inerente do cobre promove uma experiência de usuário acolhedora e convidativa. Use gradientes sutis de cobre para fundos ou texturas para adicionar profundidade sem sobrecarregar o usuário.
- Incorpore elementos naturais. Os tons quentes e terrosos do cobre complementam perfeitamente designs inspirados na natureza. Essa conexão natural de cores cria uma atmosfera calma e convidativa.
- Crie uma sensação de luxo ou vintage. A associação do cobre com metais preciosos adiciona um toque de elegância e atemporalidade. Botões, ícones ou bordas com um brilho sutil de cobre podem adicionar um toque de sofisticação. Para uma sensação vintage, incorpore texturas de cobre que se assemelham a superfícies de cobre envelhecido.
Lembre-se de que a cor e seu significado podem mudar de cultura para cultura — e a qualquer momento. Se você estiver projetando para um público global, pesquise considerações de cor para suas regiões específicas.
Para variações dentro do mesmo espectro brilhante do cobre, considere:
- Bronze (#CE8946) compartilha uma base quente de marrom-avermelhado semelhante ao cobre, mas o bronze tende a ser um pouco mais acinzentado, criando um tom mais suave e terroso.
- Canela (#D47E30) é mais quente que o cobre, incorporando seus tons ricos com uma base vermelha mais forte para um visual mais vibrante.
- Ouro rosa (#DEA193) compartilha o calor do cobre, mas com uma base mais clara e rosada.
- Siena queimada (#ED7B58) é um vermelho-marrom rústico e profundo com tons terrosos como o cobre, mas com um toque de laranja.
Para complementar o cobre, considere combiná-lo com:
- Taupe (#54463A) atua como um fundo calmo e neutro para acentos de cobre.
- Azul marinho (#000080) complementa o calor do cobre para criar uma sensação luxuosa.
- Creme (#FDFBD4) cria um contraste leve e arejado com a riqueza do cobre.
- Turquesa (#40E0D0) oferece um contraste marcante e visualmente interessante quando combinado com cobre.
Outras cores que valem a pena considerar incluem verde sálvia para uma aparência calma e natural, calêndula para um toque de cor, ou terracota para uma combinação terrosa.
Embora o cobre seja quente, ele pode entrar em conflito com:
- Verde neon (#2CFF05) pode sobrecarregar o calor do cobre devido à sua saturação extrema.
- Azul claro (#90D5FF) falta contraste quando combinado com a riqueza do cobre e pode criar uma paleta desbotada.
- Laranja (#FFA500) pode entrar em conflito com os tons vermelho-marrom do cobre.
- Preto (#000000) cria uma sensação pesada e escura quando combinado com cobre.
- Amarelo (#FFDE21) é altamente saturado, sobrecarregando o calor do cobre.
O cobre está associado à estabilidade e segurança, reforçado por sua conexão com a natureza. Em algumas culturas, acredita-se até que possua propriedades curativas.
Na psicologia das cores, o calor do cobre se traduz em sentimentos de conforto, segurança e otimismo. Ele pode estimular a mente e encorajar a criatividade. Os tons avermelhados oferecem um leve impulso de energia e motivação, enquanto os tons naturais e equilibrados evocam uma sensação de confiança e estabilidade.
O cobre pode ser uma cor versátil no design de UI. Sua riqueza o torna ideal para acentos e destaques, chamando a atenção para elementos importantes. O calor cria uma atmosfera acolhedora, perfeita para interfaces que promovem relaxamento ou criatividade. Mas, devido à sua força visual, use o cobre estrategicamente e evite o uso excessivo para prevenir um efeito avassalador.
Ao contrário de algumas cores com histórias simbólicas ricas, a história do cobre é menos sobre a cor em si e mais sobre o metal homônimo. O metal cobre remonta a 8000 a.C., quando as pessoas usavam o metal naturalmente encontrado para ferramentas e outros objetos.
Artistas criaram cores semelhantes ao cobre ao longo da história, mas a palavra "cobre" como nome de cor só apareceu em inglês em 1594.
À medida que a teoria das cores se desenvolveu nos séculos 18 e 19, o cobre se tornou uma cor reconhecida, ligando a cor do metal ao seu nome. Hoje, a cor cobre é usada para adicionar um toque de elegância ao design, arte e joias.
Variações de cor
Sombras
Tonalidades
Tons
Matizes
Harmonias de cores
Complementar
Dividida
Monocromática
Análoga
Triádica
Quadrado
Paletas personalizadas
Copperwood
Mediterrâneo
Refúgio
Verificador de contraste
Contraste 3,12
- Texto grande
#C68346
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Reprovado | Reprovado | |
Aprovado | Reprovado | |
Aprovado | Reprovado |
Contraste 6,74
- Texto grande
#C68346
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Aprovado | Reprovado | |
Aprovado | Aprovado | |
Aprovado | Aprovado |
Simulações de cor
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
A cor hexadecimal #c68346, conhecida como Cobre, tem valores RGB de R:198, G:131, B:70 e valores CMYK de C:0, M:34, Y:65, K:22.
| VALUE | CSS | |
|---|---|---|
| HEX | #c68346 | #c68346 |
| RGB DECIMAL | 198, 131, 70 | RGB(198,131,70) |
| RGB PERCENTAGE | 77.6, 51.4, 27.5 | RGB(77.6%,51.4%,27.5%) |
| CMYK | 0, 34, 65, 22 | |
| HSL | HSL(28.6, 52.9%, 52.5%) | HSL(28.6, 52.9%, 52.5%) |
| HSV (OR HSB) | 28.6°, 64.6, 77.6 | |
| WEB SAFE | #20415351 | #20415351 |
| BINARY | 11000110, 10000011, 01000110 | |
| iOS - SwiftUI | Color(red: 0.776, green: 0.514, blue: 0.275) | |
| iOS - UIKit | UIColor(red: 0.776, green: 0.514, blue: 0.275, alpha: 1) | |
| Android - Compose | Color(0xFFC68346) |


