Cor nomeada · #BB6611
Sugar Coated Almond
Sugar Coated Almond é #BB6611: rgb(187 102 17), hsl(30 83% 40%), oklch(0.597 0.138 57.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Sugar Coated Almond color name →
#BB6611
oklch(0.597 0.138 57.3)
Conversões de cor
- HEX
- #bb6611
- RGB
- rgb(187 102 17)
- HSL
- hsl(30 83% 40%)
- HWB
- hwb(30 7% 27%)
- OKLCH
- oklch(0.597 0.138 57.3)
- OKLab
- oklab(0.597 0.075 0.116)
- CIE Lab
- lab(52.53 31.2 56.79)
- LCH
- lch(52.53 64.8 61.2)
- CMYK
- cmyk(0% 45% 91% 27%)
Tons claros · Sombras · Tons
Tons claros
- C37635
- CB854F
- D29466
- D9A37C
- E0B392
- E7C2A7
- EDD1BD
- F3E0D3
- F9F0E9
Sombras
- A2580D
- 8A4A09
- 733C06
- 5C2F04
- 462302
- 321701
- 1F0C00
- 0D0400
- 020000
Tons
- B66A28
- B06D36
- AB7042
- A5734D
- A07556
- 9A785F
- 947A68
- 8D7C70
- 877E78
Harmonias de cor
Complementar +180°
- BB6611
Sugar Coated Almond
- 0089C3
≈ Azul Caribe
Análoga -30° +30°
- BB6611
Sugar Coated Almond
- C45A50
≈ Dark Salmon
- 9E7900
≈ Yellowish Brown
Tríade +120° +240°
- BB6611
Sugar Coated Almond
- 00947E
≈ Aqua Waters
- 896BC7
≈ Lavish Spending
Complementar dividida +150° +210°
- BB6611
Sugar Coated Almond
- 00909E
≈ Coral Coast
- 5A7AD1
≈ Serenity’s Reign
Tétrade +90° +180° +270°
- BB6611
Sugar Coated Almond
- 3A954B
≈ Formal Garden
- 0089C3
≈ Azul Caribe
- AA5EA9
≈ Royalty Loyalty
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 4.18:1 · APCA Lc 68
Ag
AASobre preto
WCAG 5.02:1 · APCA Lc 33
Melhor cor de texto: #000000
WCAG 5.02:1 (AA) · APCA Lc 33
Contrast pairs
Trechos de código
CSS
:root {
--sugar-coated-almond: #bb6611;
--sugar-coated-almond-rgb: 187 102 17;
--sugar-coated-almond-oklch: oklch(0.597 0.138 57.3);
}
.element {
color: var(--sugar-coated-almond);
background-color: hsl(30 83% 40%);
border-color: oklch(0.597 0.138 57.3);
}Tailwind CSS v4
@theme {
--color-sugar-coated-almond: #bb6611;
--color-sugar-coated-almond-50: #ffedce;
--color-sugar-coated-almond-100: #ffdeba;
--color-sugar-coated-almond-200: #ffc699;
--color-sugar-coated-almond-300: #eca66d;
--color-sugar-coated-almond-400: #db8743;
--color-sugar-coated-almond-500: #c86900;
--color-sugar-coated-almond-600: #a95a03;
--color-sugar-coated-almond-700: #884805;
--color-sugar-coated-almond-800: #663305;
--color-sugar-coated-almond-900: #472304;
--color-sugar-coated-almond-950: #2e1100;
}SCSS
$sugar-coated-almond: #bb6611;
$sugar-coated-almond-rgb: 187, 102, 17;
$sugar-coated-almond-light: mix(#fff, $sugar-coated-almond, 20%);
$sugar-coated-almond-dark: mix(#000, $sugar-coated-almond, 20%);
.element {
color: $sugar-coated-almond;
box-shadow: 0 0 0 2px rgba($sugar-coated-almond, 0.35);
}