Named color · #F5F5DC
Holy White
Holy White is #F5F5DC: rgb(245 245 220), hsl(60 56% 91%), oklch(0.964 0.033 107). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Holy White color name →
#F5F5DC
oklch(0.964 0.033 107)
Color conversions
- HEX
- #f5f5dc
- RGB
- rgb(245 245 220)
- HSL
- hsl(60 56% 91%)
- HWB
- hwb(60 86% 4%)
- OKLCH
- oklch(0.964 0.033 107)
- OKLab
- oklab(0.964 -0.01 0.031)
- CIE Lab
- lab(96.04 -3.11 12.09)
- LCH
- lch(96.04 12.49 104.4)
- CMYK
- cmyk(0% 0% 10% 4%)
Tints · Shades · Tones
Tints
- F6F6E0
- F7F7E3
- F8F8E7
- F9F9EA
- FAFAEE
- FBFBF1
- FCFCF5
- FDFDF8
- FEFEFC
Shades
- D5D5BF
- B6B6A3
- 989888
- 7B7B6E
- 5F5F54
- 44443C
- 2B2B26
- 151511
- 030302
Tones
- E9E9D2
- DDDDC9
- D0D1C0
- C5C5B6
- B9B9AD
- ADADA4
- A2A29B
- 969692
- 8B8B89
Color harmonies
Complementary +180°
- F5F5DC
Holy White
- F2F1FF
≈ Cloud Break
Analogous -30° +30°
- F5F5DC
Holy White
- FFF1DD
≈ Flickering Light
- E9F9E3
≈ Panache
Triadic +120° +240°
- F5F5DC
Holy White
- E4F7FF
≈ Clear Skies
- FFEDF6
≈ Partial Pink
Split-complementary +150° +210°
- F5F5DC
Holy White
- ECF4FF
≈ Placebo Blue
- FAEEFF
≈ Lovely Euphoric Delight
Tetradic +90° +180° +270°
- F5F5DC
Holy White
- DBFAFB
≈ Salt Mountain
- F2F1FF
≈ Cloud Break
- FFEEEF
≈ White Gloss
Contrast & accessibility
Ag
FailOn white
WCAG 1.10:1 · APCA Lc 0
Ag
AAAOn black
WCAG 18.97:1 · APCA Lc 100
Best text color: #000000
WCAG 18.97:1 (AAA) · APCA Lc 100
Contrast pairs
Code snippets
CSS
:root {
--holy-white: #f5f5dc;
--holy-white-rgb: 245 245 220;
--holy-white-oklch: oklch(0.964 0.033 107);
}
.element {
color: var(--holy-white);
background-color: hsl(60 56% 91%);
border-color: oklch(0.964 0.033 107);
}Tailwind CSS v4
@theme {
--color-holy-white: #f5f5dc;
--color-holy-white-50: #f6f6eb;
--color-holy-white-100: #e8e9dd;
--color-holy-white-200: #d5d6c6;
--color-holy-white-300: #b8b9a6;
--color-holy-white-400: #a0a08a;
--color-holy-white-500: #88886f;
--color-holy-white-600: #73735e;
--color-holy-white-700: #5c5c4b;
--color-holy-white-800: #444336;
--color-holy-white-900: #2f2e25;
--color-holy-white-950: #1b1b14;
}SCSS
$holy-white: #f5f5dc;
$holy-white-rgb: 245, 245, 220;
$holy-white-light: mix(#fff, $holy-white, 20%);
$holy-white-dark: mix(#000, $holy-white, 20%);
.element {
color: $holy-white;
box-shadow: 0 0 0 2px rgba($holy-white, 0.35);
}