Named color · #FFF0F5
Lavender Blush
Lavender Blush is #FFF0F5: rgb(255 240 245), hsl(340 100% 97%), oklch(0.968 0.017 355.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Lavender Blush color name →
#FFF0F5
oklch(0.968 0.017 355.1)
Color conversions
- HEX
- #fff0f5
- RGB
- rgb(255 240 245)
- HSL
- hsl(340 100% 97%)
- HWB
- hwb(340 94% 0%)
- OKLCH
- oklch(0.968 0.017 355.1)
- OKLab
- oklab(0.968 0.017 -0.001)
- CIE Lab
- lab(96.1 5.86 -0.51)
- LCH
- lch(96.1 5.88 355)
- CMYK
- cmyk(0% 6% 4% 0%)
Tints · Shades · Tones
Tints
- FFF1F6
- FFF3F7
- FFF4F8
- FFF6F9
- FFF7FA
- FFF9FB
- FFFAFC
- FFFCFD
- FFFDFE
Shades
- DED1D5
- BEB2B6
- 9E9598
- 80787B
- 635D5F
- 484344
- 2E2A2B
- 161415
- 030303
Tones
- F2E4E9
- E4D9DD
- D7CDD0
- CAC2C5
- BEB6B9
- B1ABAD
- A4A0A2
- 989596
- 8C8B8B
Color harmonies
Complementary +180°
- FFF0F5
Lavender Blush
- E9F9F4
≈ Melting Glacier
Analogous -30° +30°
- FFF0F5
Lavender Blush
- FBF1FB
≈ Pinkish White
- FFF1EF
≈ Polished Pink
Triadic +120° +240°
- FFF0F5
Lavender Blush
- F4F6E9
≈ Applemint Soda
- EAF7FF
≈ Clear Skies
Split-complementary +150° +210°
- FFF0F5
Lavender Blush
- EEF8EE
≈ Soft Petals
- E8F8FA
≈ Calm Waters
Tetradic +90° +180° +270°
- FFF0F5
Lavender Blush
- FAF4E8
≈ White Fever
- E9F9F4
≈ Melting Glacier
- F0F5FF
≈ Cotton Ball
Contrast & accessibility
Ag
FailOn white
WCAG 1.10:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.03:1 · APCA Lc 100
Best text color: #000000
WCAG 19.03:1 (AAA) · APCA Lc 100
Contrast pairs
Code snippets
CSS
:root {
--lavender-blush: #fff0f5;
--lavender-blush-rgb: 255 240 245;
--lavender-blush-oklch: oklch(0.968 0.017 355.1);
}
.element {
color: var(--lavender-blush);
background-color: hsl(340 100% 97%);
border-color: oklch(0.968 0.017 355.1);
}Tailwind CSS v4
@theme {
--color-lavender-blush: #fff0f5;
--color-lavender-blush-50: #faf3f5;
--color-lavender-blush-100: #ede6e8;
--color-lavender-blush-200: #dbd1d4;
--color-lavender-blush-300: #bfb4b7;
--color-lavender-blush-400: #a79a9f;
--color-lavender-blush-500: #908287;
--color-lavender-blush-600: #7a6e72;
--color-lavender-blush-700: #62585b;
--color-lavender-blush-800: #484043;
--color-lavender-blush-900: #322c2e;
--color-lavender-blush-950: #1e191b;
}SCSS
$lavender-blush: #fff0f5;
$lavender-blush-rgb: 255, 240, 245;
$lavender-blush-light: mix(#fff, $lavender-blush, 20%);
$lavender-blush-dark: mix(#000, $lavender-blush, 20%);
.element {
color: $lavender-blush;
box-shadow: 0 0 0 2px rgba($lavender-blush, 0.35);
}