Âmbar é uma cor quente e convidativa que combina o brilho dourado do amarelo com a riqueza do laranja. Ela exala uma vibração ensolarada e alegre que captura a essência de seu homônimo, a resina fossilizada de árvore. Localiza-se entre o amarelo e o laranja na roda de cores, tornando-se perfeita para adicionar um toque de calor e luminosidade aos designs e aprimorar visuais com seu apelo radiante e acolhedor.

Âmbar é definido pelos seguintes códigos e valores de cor para garantir consistência em várias plataformas e dispositivos digitais.
- Código HEX: #FFBF00
- Valor RGB: 100% vermelho, 74,9% verde e 0% azul
A escolha de cores no design de UX e UI deve considerar critérios de acessibilidade, que são fundamentais. Figma oferece plugins na Comunidade para garantir que seus designs atendam às Diretrizes de Acessibilidade de Conteúdo da Web.
Os tons ricos e dourados do âmbar trazem calor e vivacidade ao design de UI. Veja como aproveitar seu potencial de forma eficaz:
- Crie contraste e hierarquia. Âmbar é excelente para estabelecer uma hierarquia visual clara, destacando-se em fundos claros e escuros. Use-o para títulos, botões ou outros elementos-chave para melhorar a legibilidade e guiar o olhar do usuário pelo seu conteúdo.
- Desperte emoções positivas. O brilho quente do âmbar cria uma atmosfera acolhedora e convidativa em interfaces web e de aplicativos. Imagine uma plataforma de reservas de viagens usando acentos de âmbar para evocar o calor e a empolgação de umas férias dos sonhos.
- Guie a interação do usuário. Como uma cor de destaque, o âmbar é uma ótima escolha para realçar elementos interativos. Use-o para atrair a atenção do usuário e incentivar a interação, como um botão de Reservar Agora.
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 radiante e quente do âmbar, considere:
- Goldenrod (#DAA520) captura a essência do âmbar com uma luminosidade ligeiramente mais suave, evocando a sensação quente e natural de campos de fim de verão.
- Marigold (#FBE870) é mais clara e brilhante, oferecendo um tom ensolarado e alegre que compartilha o calor convidativo e a energia vibrante do âmbar.
- Saffron (#F4C430) introduz um toque de laranja, espelhando o brilho dourado do âmbar com um subtom ligeiramente mais exótico e picante.
- Mustard (#FFDB58) é uma versão mais suave, mantendo o calor do âmbar enquanto adiciona um toque de rusticidade para um apelo mais discreto.
Para complementar os tons brilhantes do âmbar, considere combiná-lo com:
- Teal profundo (#00585E) fornece um fundo rico e contrastante que faz o brilho do âmbar se destacar, evocando a profundidade das águas oceânicas contra um pôr do sol.
- Cinza carvão (#4A4A4A) oferece um equilíbrio neutro e sofisticado à vivacidade do âmbar, ancorando a paleta com elegância moderna.
- Marfim (#FFFFE3) é suave e claro, criando um contraste gentil que realça o calor do âmbar para uma atmosfera acolhedora e convidativa.
- Ameixa (#8E4585) adiciona um complemento profundo e luxuoso, combinando lindamente com o âmbar para uma vibração rica e outonal.
- Verde floresta (#2E6F40) ancorando a paleta com seu tom profundo e natural, ecoando as cores de uma floresta iluminada pelo sol e destacando as qualidades terrosas do âmbar.
Outras cores que valem a pena considerar incluem azul marinho para um visual clássico e digno, creme para uma mistura suave e harmoniosa, e bordô para um contraste ousado e dramático.
Embora o âmbar seja versátil, ele pode entrar em conflito com:
- Rosa brilhante (#FF69B4) pode ser muito forte e vibrante, ofuscando o brilho natural do âmbar com um contraste que pode parecer chocante.
- Verde limão (#89F336), com sua alta intensidade, pode desviar do calor do âmbar, criando uma combinação visualmente desconfortável.
- Azul elétrico (#00F0FF) oferece um contraste frio e vívido que pode ofuscar a sutileza e o calor do âmbar, levando a um choque de energias.
- Laranja neon (#FFA500), embora próximo no espectro, pode competir diretamente com o âmbar, resultando em uma paleta que carece de distinção e equilíbrio.
- Roxo brilhante (#800080), embora régio, pode sobrepujar o brilho dourado do âmbar com sua dominância, potencialmente criando um efeito visual discordante.
Com sua beleza natural e brilho semelhante ao sol, o âmbar representa calor, conforto e nostalgia. Seus aspectos amarelos trazem brilho e otimismo, e seus tons alaranjados inspiram criatividade. Através das culturas, o valor do âmbar varia: na Grécia antiga, era visto como um presente divino de Apolo, simbolizando a vida eterna; na cultura chinesa, representa coragem e força. Na tradição nativa americana, é um talismã protetor.
Na psicologia das cores, o tom alegre do âmbar promove energia, estimulando os sentidos e despertando entusiasmo e excitação.
No design de UI/UX, o âmbar torna as interfaces de usuário mais atraentes. Ele destaca recursos importantes como CTAs e notificações, melhorando o engajamento do usuário. Âmbar pode criar uma atmosfera calorosa e acolhedora, usando seus efeitos psicológicos para aprimorar a experiência do usuário. Isso pode fazer a marca parecer amigável e animada.
O nome âmbar origina-se do material conhecido como âmbar—uma resina de árvore fossilizada admirada por séculos por sua beleza natural e brilho quente. O uso do termo "âmbar" como nome de cor foi documentado pela primeira vez em inglês em 1500.
Historicamente, o âmbar foi associado à magia, espiritualidade e até cura. Civilizações antigas transformavam âmbar em joias, amuletos e objetos decorativos, que muitas vezes eram símbolos de riqueza e status.
Variações de cor
Sombras
Tonalidades
Tons
Matizes
Harmonias de cores
Complementar
Dividida
Monocromática
Análoga
Triádica
Quadrado
Paletas personalizadas
Favo de mel
Dia ensolarado
Recém espremido
Verificador de contraste
Contraste 1,65
- Texto grande
#FFBF00
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Reprovado | Reprovado | |
Reprovado | Reprovado | |
Reprovado | Reprovado |
Contraste 12,7
- Texto grande
#FFBF00
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Aprovado | Aprovado | |
Aprovado | Aprovado | |
Aprovado | Aprovado |
Simulações de cor
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
A cor hexadecimal #ffbf00, conhecida como Âmbar, tem valores RGB de R:255, G:191, B:0 e valores CMYK de C:0, M:25, Y:100, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | #ffbf00 | #ffbf00 |
| RGB DECIMAL | 255, 191, 0 | RGB(255,191,0) |
| RGB PERCENTAGE | 100.0, 74.9, 0.0 | RGB(100.0%,74.9%,0.0%) |
| CMYK | 0, 25, 100, 0 | |
| HSL | HSL(44.9, 100.0%, 50.0%) | HSL(44.9, 100.0%, 50.0%) |
| HSV (OR HSB) | 44.9°, 100.0, 100.0 | |
| WEB SAFE | #2552040 | #2552040 |
| BINARY | 11111111, 10111111, 00000000 | |
| iOS - SwiftUI | Color(red: 1.000, green: 0.749, blue: 0.000) | |
| iOS - UIKit | UIColor(red: 1.000, green: 0.749, blue: 0.000, alpha: 1) | |
| Android - Compose | Color(0xFFFFBF00) |


