Named color · #FFF8D1
Baja White
Baja White is #FFF8D1: rgb(255 248 209), hsl(51 100% 91%), oklch(0.975 0.051 98.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Baja White color name →
#FFF8D1
oklch(0.975 0.051 98.8)
Color conversions
- HEX
- #fff8d1
- RGB
- rgb(255 248 209)
- HSL
- hsl(51 100% 91%)
- HWB
- hwb(51 82% 0%)
- OKLCH
- oklch(0.975 0.051 98.8)
- OKLab
- oklab(0.975 -0.008 0.05)
- CIE Lab
- lab(97.39 -2.16 19.71)
- LCH
- lch(97.39 19.82 96.3)
- CMYK
- cmyk(0% 3% 18% 0%)
Tints · Shades · Tones
Tints
- FFF9D6
- FFF9DA
- FFFADF
- FFFBE4
- FFFCE8
- FFFCED
- FFFDF1
- FFFEF6
- FFFEFA
Shades
- DED8B5
- BEB89B
- 9E9A81
- 807C68
- 636050
- 484539
- 2E2C23
- 161510
- 030302
Tones
- F2EBC9
- E4DFC0
- D7D3B8
- CAC6B0
- BDBAA8
- B1AEA0
- A4A398
- 989790
- 8C8B88
Color harmonies
Complementary +180°
- FFF8D1
Baja White
- F5F6FF
≈ Mā White
Analogous -30° +30°
- FFF8D1
Baja White
- FFF5EA
≈ What’s Left
- ECFEDA
≈ Nyanza
Triadic +120° +240°
- FFF8D1
Baja White
- EAFAFF
≈ Placebo Sky
- FFF3FA
≈ Pinkish White
Split-complementary +150° +210°
- FFF8D1
Baja White
- F0F8FF
≈ Alice Blue
- FAF4FF
≈ Sugar Crystal
Tetradic +90° +180° +270°
- FFF8D1
Baja White
- DDFFFB
≈ Cold Canada
- F5F6FF
≈ Mā White
- FFF3F5
≈ Glimpse of Pink
Contrast & accessibility
Ag
FailOn white
WCAG 1.07:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.59:1 · APCA Lc 103
Best text color: #000000
WCAG 19.59:1 (AAA) · APCA Lc 103
Contrast pairs
Code snippets
CSS
:root {
--baja-white: #fff8d1;
--baja-white-rgb: 255 248 209;
--baja-white-oklch: oklch(0.975 0.051 98.8);
}
.element {
color: var(--baja-white);
background-color: hsl(51 100% 91%);
border-color: oklch(0.975 0.051 98.8);
}Tailwind CSS v4
@theme {
--color-baja-white: #fff8d1;
--color-baja-white-50: #f8f6e5;
--color-baja-white-100: #ebe9d6;
--color-baja-white-200: #d9d5bd;
--color-baja-white-300: #bdb99b;
--color-baja-white-400: #a69f7d;
--color-baja-white-500: #8e8760;
--color-baja-white-600: #787251;
--color-baja-white-700: #605b41;
--color-baja-white-800: #47432e;
--color-baja-white-900: #312e1f;
--color-baja-white-950: #1d1b0f;
}SCSS
$baja-white: #fff8d1;
$baja-white-rgb: 255, 248, 209;
$baja-white-light: mix(#fff, $baja-white, 20%);
$baja-white-dark: mix(#000, $baja-white, 20%);
.element {
color: $baja-white;
box-shadow: 0 0 0 2px rgba($baja-white, 0.35);
}