Nearest named color · #F1FCF3
#F1FCF3
Nearest named color: Bath Bubbles
#F1FCF3 (rgb(241 252 243), hsl(131 65% 97%), oklch(0.98 0.017 151.1)) is closest to the named color Bath Bubbles. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F1FCF3
oklch(0.98 0.017 151.1)
Color conversions
- HEX
- #f1fcf3
- RGB
- rgb(241 252 243)
- HSL
- hsl(131 65% 97%)
- HWB
- hwb(131 95% 1%)
- OKLCH
- oklch(0.98 0.017 151.1)
- OKLab
- oklab(0.98 -0.014 0.008)
- CIE Lab
- lab(97.95 -4.94 3)
- LCH
- lch(97.95 5.78 148.7)
- CMYK
- cmyk(4% 0% 4% 1%)
Tints · Shades · Tones
Tints
- F2FCF4
- F4FDF5
- F5FDF7
- F7FDF8
- F8FEF9
- F9FEFA
- FBFEFB
- FCFEFD
- FEFFFE
Shades
- D2DBD3
- B3BBB4
- 959C97
- 797E7A
- 5D625E
- 434744
- 2B2D2B
- 141614
- 030303
Tones
- E5EFE7
- D9E2DB
- CED5CF
- C2C9C3
- B7BCB8
- ACB0AC
- A1A4A1
- 969896
- 8B8C8B
Color harmonies
Complementary +180°
- F1FCF3
Bath Bubbles
- FFF5FD
≈ Cold Snow
Analogous -30° +30°
- F1FCF3
Bath Bubbles
- F7FBEE
≈ Enoki
- EDFDF9
≈ Cold White
Triadic +120° +240°
- F1FCF3
Bath Bubbles
- F6F8FF
≈ Ghost White
- FFF6F5
≈ Sea Salt Sherbet
Split-complementary +150° +210°
- F1FCF3
Bath Bubbles
- FAF7FF
≈ Ghost White
- FFF6F8
≈ Sea Salt Sherbet
Tetradic +90° +180° +270°
- F1FCF3
Bath Bubbles
- F3FAFF
≈ Alice Blue
- FFF5FD
≈ Cold Snow
- FFF7F1
≈ Seashell
Contrast & accessibility
Ag
FailOn white
WCAG 1.05:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.95:1 · APCA Lc 104
Best text color: #000000
WCAG 19.95:1 (AAA) · APCA Lc 104
Contrast pairs
Code snippets
CSS
:root {
--bath-bubbles: #f1fcf3;
--bath-bubbles-rgb: 241 252 243;
--bath-bubbles-oklch: oklch(0.98 0.017 151.1);
}
.element {
color: var(--bath-bubbles);
background-color: hsl(131 65% 97%);
border-color: oklch(0.98 0.017 151.1);
}Tailwind CSS v4
@theme {
--color-bath-bubbles: #f1fcf3;
--color-bath-bubbles-50: #f2f7f3;
--color-bath-bubbles-100: #e4e9e5;
--color-bath-bubbles-200: #cfd6d1;
--color-bath-bubbles-300: #b1bab3;
--color-bath-bubbles-400: #98a199;
--color-bath-bubbles-500: #7f8981;
--color-bath-bubbles-600: #6b746d;
--color-bath-bubbles-700: #565d57;
--color-bath-bubbles-800: #3f443f;
--color-bath-bubbles-900: #2b2f2c;
--color-bath-bubbles-950: #181c19;
}SCSS
$bath-bubbles: #f1fcf3;
$bath-bubbles-rgb: 241, 252, 243;
$bath-bubbles-light: mix(#fff, $bath-bubbles, 20%);
$bath-bubbles-dark: mix(#000, $bath-bubbles, 20%);
.element {
color: $bath-bubbles;
box-shadow: 0 0 0 2px rgba($bath-bubbles, 0.35);
}