Named color · #FFBB31
Garuda Gold
Garuda Gold is #FFBB31: rgb(255 187 49), hsl(40 100% 60%), oklch(0.834 0.16 79.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Garuda Gold color name →
#FFBB31
oklch(0.834 0.16 79.7)
Color conversions
- HEX
- #ffbb31
- RGB
- rgb(255 187 49)
- HSL
- hsl(40 100% 60%)
- HWB
- hwb(40 19% 0%)
- OKLCH
- oklch(0.834 0.16 79.7)
- OKLab
- oklab(0.834 0.029 0.158)
- CIE Lab
- lab(80.77 17.16 73.42)
- LCH
- lch(80.77 75.4 76.8)
- CMYK
- cmyk(0% 27% 81% 0%)
Tints · Shades · Tones
Tints
- FFC252
- FFCA6B
- FFD180
- FFD894
- FFDEA7
- FFE5B9
- FFECCB
- FFF2DD
- FFF9EE
Shades
- DEA229
- BE8A22
- 9E731A
- 805C13
- 63460C
- 483206
- 2E1F03
- 160D01
- 030200
Tones
- F2B543
- E5B050
- D8AA5A
- CBA462
- BE9E69
- B2986F
- A59274
- 998C79
- 8C867D
Color harmonies
Complementary +180°
- FFBB31
Garuda Gold
- A9CAFF
≈ Night Snow
Analogous -30° +30°
- FFBB31
Garuda Gold
- FFB58D
≈ Coral Dusk
- D0D140
≈ Southern Platyfish
Triadic +120° +240°
- FFBB31
Garuda Gold
- 00E4EC
≈ Cold Heights
- EFACFF
≈ Pink Sugar
Split-complementary +150° +210°
- FFBB31
Garuda Gold
- 7CD6FF
≈ Sky
- C7BFFF
≈ Lavender Tonic
Tetradic +90° +180° +270°
- FFBB31
Garuda Gold
- 25E9B8
≈ Aquamarine
- A9CAFF
≈ Night Snow
- FFABD3
≈ Majin Bū Pink
Contrast & accessibility
Ag
FailOn white
WCAG 1.69:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.40:1 · APCA Lc 73
Best text color: #000000
WCAG 12.40:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--garuda-gold: #ffbb31;
--garuda-gold-rgb: 255 187 49;
--garuda-gold-oklch: oklch(0.834 0.16 79.7);
}
.element {
color: var(--garuda-gold);
background-color: hsl(40 100% 60%);
border-color: oklch(0.834 0.16 79.7);
}Tailwind CSS v4
@theme {
--color-garuda-gold: #ffbb31;
--color-garuda-gold-50: #fff1c2;
--color-garuda-gold-100: #ffe3ab;
--color-garuda-gold-200: #f7ce83;
--color-garuda-gold-300: #e0af4c;
--color-garuda-gold-400: #cf9100;
--color-garuda-gold-500: #bc7500;
--color-garuda-gold-600: #9f6300;
--color-garuda-gold-700: #804f00;
--color-garuda-gold-800: #603900;
--color-garuda-gold-900: #432700;
--color-garuda-gold-950: #2b1500;
}SCSS
$garuda-gold: #ffbb31;
$garuda-gold-rgb: 255, 187, 49;
$garuda-gold-light: mix(#fff, $garuda-gold, 20%);
$garuda-gold-dark: mix(#000, $garuda-gold, 20%);
.element {
color: $garuda-gold;
box-shadow: 0 0 0 2px rgba($garuda-gold, 0.35);
}