Named color · #B4E1BB
Fringy Flower
Fringy Flower is #B4E1BB: rgb(180 225 187), hsl(129 43% 79%), oklch(0.868 0.07 149.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Fringy Flower color name →
#B4E1BB
oklch(0.868 0.07 149.3)
Color conversions
- HEX
- #b4e1bb
- RGB
- rgb(180 225 187)
- HSL
- hsl(129 43% 79%)
- HWB
- hwb(129 71% 12%)
- OKLCH
- oklch(0.868 0.07 149.3)
- OKLab
- oklab(0.868 -0.06 0.036)
- CIE Lab
- lab(85.58 -20.65 13.65)
- LCH
- lch(85.58 24.75 146.5)
- CMYK
- cmyk(20% 0% 17% 12%)
Tints · Shades · Tones
Tints
- BCE4C2
- C3E7C8
- CBEACF
- D2EDD6
- DAF0DD
- E1F3E4
- E9F6EA
- F0F9F1
- F8FCF8
Shades
- 9CC4A2
- 85A78A
- 6E8B73
- 58705C
- 445646
- 303E32
- 1D271F
- 0C120D
- 020202
Tones
- AFD7B5
- AACDAF
- A5C3A9
- 9FB9A3
- 9AAF9D
- 95A697
- 909C91
- 8B938C
- 858986
Color harmonies
Complementary +180°
- B4E1BB
Fringy Flower
- EEC4EA
≈ Purple’s Baby Sister
Analogous -30° +30°
- B4E1BB
Fringy Flower
- CEDBA7
≈ Chameleon
- A1E3D5
≈ Menthol Kiss
Triadic +120° +240°
- B4E1BB
Fringy Flower
- C2D2FF
≈ Pale Phthalo Blue
- FEC3B9
≈ Impatiens Pink
Split-complementary +150° +210°
- B4E1BB
Fringy Flower
- DACAFC
≈ Foggy Heath
- FBC1D2
≈ Tassel Flower
Tetradic +90° +180° +270°
- B4E1BB
Fringy Flower
- AADBFD
≈ Droplet
- EEC4EA
≈ Purple’s Baby Sister
- F7C9A6
≈ Fresco Cream
Contrast & accessibility
Ag
FailOn white
WCAG 1.45:1 · APCA Lc 22
Ag
AAAOn black
WCAG 14.42:1 · APCA Lc 82
Best text color: #000000
WCAG 14.42:1 (AAA) · APCA Lc 82
Contrast pairs
Code snippets
CSS
:root {
--fringy-flower: #b4e1bb;
--fringy-flower-rgb: 180 225 187;
--fringy-flower-oklch: oklch(0.868 0.07 149.3);
}
.element {
color: var(--fringy-flower);
background-color: hsl(129 43% 79%);
border-color: oklch(0.868 0.07 149.3);
}Tailwind CSS v4
@theme {
--color-fringy-flower: #b4e1bb;
--color-fringy-flower-50: #e7fbeb;
--color-fringy-flower-100: #d8efdc;
--color-fringy-flower-200: #bfddc5;
--color-fringy-flower-300: #9ec2a6;
--color-fringy-flower-400: #82aa88;
--color-fringy-flower-500: #65936d;
--color-fringy-flower-600: #557d5c;
--color-fringy-flower-700: #44644a;
--color-fringy-flower-800: #324934;
--color-fringy-flower-900: #223324;
--color-fringy-flower-950: #111e12;
}SCSS
$fringy-flower: #b4e1bb;
$fringy-flower-rgb: 180, 225, 187;
$fringy-flower-light: mix(#fff, $fringy-flower, 20%);
$fringy-flower-dark: mix(#000, $fringy-flower, 20%);
.element {
color: $fringy-flower;
box-shadow: 0 0 0 2px rgba($fringy-flower, 0.35);
}