Named color · #B8C7DB
Beribboned
Beribboned is #B8C7DB: rgb(184 199 219), hsl(214 33% 79%), oklch(0.825 0.033 255.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Beribboned color name →
#B8C7DB
oklch(0.825 0.033 255.6)
Color conversions
- HEX
- #b8c7db
- RGB
- rgb(184 199 219)
- HSL
- hsl(214 33% 79%)
- HWB
- hwb(214 72% 14%)
- OKLCH
- oklch(0.825 0.033 255.6)
- OKLab
- oklab(0.825 -0.008 -0.032)
- CIE Lab
- lab(79.56 -2.23 -11.84)
- LCH
- lch(79.56 12.04 259.3)
- CMYK
- cmyk(16% 9% 0% 14%)
Tints · Shades · Tones
Tints
- BFCDDF
- C6D2E2
- CDD8E6
- D4DDE9
- DBE3ED
- E2E8F1
- E9EEF4
- F1F4F8
- F8F9FB
Shades
- A0ADBE
- 8893A2
- 717A87
- 5B626D
- 454C54
- 31363C
- 1E2126
- 0C0E11
- 020202
Tones
- B2C0D2
- ADB8C8
- A7B1BF
- A1AAB6
- 9CA3AD
- 969CA3
- 90959A
- 8B8E92
- 858789
Color harmonies
Complementary +180°
- B8C7DB
Beribboned
- D2C3AF
≈ Pale Parchment
Analogous -30° +30°
- B8C7DB
Beribboned
- B0CAD6
≈ Sailing on the Bay
- C3C3DA
≈ Lavender Escape
Triadic +120° +240°
- B8C7DB
Beribboned
- DABEBE
≈ Rosario Ridge
- BCCBB6
≈ Isle of Dreams
Split-complementary +150° +210°
- B8C7DB
Beribboned
- D9C0B4
≈ Champagne Glee
- C8C7AF
≈ Nature Spirits
Tetradic +90° +180° +270°
- B8C7DB
Beribboned
- D6BECA
≈ Magnolia White
- D2C3AF
≈ Pale Parchment
- B3CDC1
≈ Tyrol
Contrast & accessibility
Ag
FailOn white
WCAG 1.71:1 · APCA Lc 31
Ag
AAAOn black
WCAG 12.23:1 · APCA Lc 72
Best text color: #000000
WCAG 12.23:1 (AAA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--beribboned: #b8c7db;
--beribboned-rgb: 184 199 219;
--beribboned-oklch: oklch(0.825 0.033 255.6);
}
.element {
color: var(--beribboned);
background-color: hsl(214 33% 79%);
border-color: oklch(0.825 0.033 255.6);
}Tailwind CSS v4
@theme {
--color-beribboned: #b8c7db;
--color-beribboned-50: #eff6ff;
--color-beribboned-100: #e1e8f3;
--color-beribboned-200: #ccd5e2;
--color-beribboned-300: #adb8c8;
--color-beribboned-400: #92a0b2;
--color-beribboned-500: #78889c;
--color-beribboned-600: #667384;
--color-beribboned-700: #515c6a;
--color-beribboned-800: #3b434e;
--color-beribboned-900: #282e36;
--color-beribboned-950: #161b21;
}SCSS
$beribboned: #b8c7db;
$beribboned-rgb: 184, 199, 219;
$beribboned-light: mix(#fff, $beribboned, 20%);
$beribboned-dark: mix(#000, $beribboned, 20%);
.element {
color: $beribboned;
box-shadow: 0 0 0 2px rgba($beribboned, 0.35);
}