Named color · #FFBD2B
Brimstone
Brimstone is #FFBD2B: rgb(255 189 43), hsl(41 100% 58%), oklch(0.838 0.163 81.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Brimstone color name →
#FFBD2B
oklch(0.838 0.163 81.3)
Color conversions
- HEX
- #ffbd2b
- RGB
- rgb(255 189 43)
- HSL
- hsl(41 100% 58%)
- HWB
- hwb(41 17% 0%)
- OKLCH
- oklch(0.838 0.163 81.3)
- OKLab
- oklab(0.838 0.025 0.161)
- CIE Lab
- lab(81.22 16.05 75.53)
- LCH
- lch(81.22 77.21 78)
- CMYK
- cmyk(0% 26% 83% 0%)
Tints · Shades · Tones
Tints
- FFC44F
- FFCB69
- FFD27F
- FFD993
- FFDFA6
- FFE6B9
- FFECCB
- FFF3DC
- FFF9EE
Shades
- DEA424
- BE8C1D
- 9E7416
- 805D10
- 63470A
- 483305
- 2E1F02
- 160D01
- 030200
Tones
- F2B73F
- E5B14D
- D8AB58
- CBA561
- BE9F68
- B2996E
- A59374
- 998D78
- 8C867C
Color harmonies
Complementary +180°
- FFBD2B
Brimstone
- ADCBFF
≈ Night Snow
Analogous -30° +30°
- FFBD2B
Brimstone
- FFB78D
≈ Coral Wisp
- CED340
≈ Southern Platyfish
Triadic +120° +240°
- FFBD2B
Brimstone
- 00E5F0
≈ Cold Heights
- F2ACFF
≈ Pink Sugar
Split-complementary +150° +210°
- FFBD2B
Brimstone
- 83D6FF
≈ Kul Sharif Blue
- CAC0FF
≈ Lavender Tonic
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.67:1 · APCA Lc 29
Ag
AAAOn black
WCAG 12.56:1 · APCA Lc 74
Best text color: #000000
WCAG 12.56:1 (AAA) · APCA Lc 74
Contrast pairs
Code snippets
CSS
:root {
--brimstone: #ffbd2b;
--brimstone-rgb: 255 189 43;
--brimstone-oklch: oklch(0.838 0.163 81.3);
}
.element {
color: var(--brimstone);
background-color: hsl(41 100% 58%);
border-color: oklch(0.838 0.163 81.3);
}Tailwind CSS v4
@theme {
--color-brimstone: #ffbd2b;
--color-brimstone-50: #fff2c0;
--color-brimstone-100: #ffe4a9;
--color-brimstone-200: #f6ce81;
--color-brimstone-300: #dfaf49;
--color-brimstone-400: #ce9200;
--color-brimstone-500: #bb7600;
--color-brimstone-600: #9e6400;
--color-brimstone-700: #7f5000;
--color-brimstone-800: #5f3900;
--color-brimstone-900: #432700;
--color-brimstone-950: #2b1500;
}SCSS
$brimstone: #ffbd2b;
$brimstone-rgb: 255, 189, 43;
$brimstone-light: mix(#fff, $brimstone, 20%);
$brimstone-dark: mix(#000, $brimstone, 20%);
.element {
color: $brimstone;
box-shadow: 0 0 0 2px rgba($brimstone, 0.35);
}