Nazwany kolor · #B9C6CB
Flowing Breeze
Flowing Breeze to #B9C6CB: rgb(185 198 203), hsl(197 15% 76%), oklch(0.818 0.016 222.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Flowing Breeze color name →
#B9C6CB
oklch(0.818 0.016 222.7)
Konwersje koloru
- HEX
- #b9c6cb
- RGB
- rgb(185 198 203)
- HSL
- hsl(197 15% 76%)
- HWB
- hwb(197 73% 20%)
- OKLCH
- oklch(0.818 0.016 222.7)
- OKLab
- oklab(0.818 -0.012 -0.011)
- CIE Lab
- lab(78.98 -3.87 -4.12)
- LCH
- lch(78.98 5.65 226.8)
- CMYK
- cmyk(9% 2% 0% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C0CCD0
- C7D1D5
- CED7DA
- D5DCE0
- DCE2E5
- E3E8EA
- EAEEEF
- F1F3F4
- F8F9FA
Odcienie ciemniejsze
- A0ACB0
- 899296
- 717A7D
- 5B6265
- 464B4D
- 313537
- 1E2122
- 0D0E0F
- 020202
Tony
- B3BFC3
- ADB8BC
- A8B0B4
- A2A9AC
- 9CA2A5
- 969B9D
- 919496
- 8B8E8E
- 868787
Harmonie kolorów
Komplementarna +180°
- B9C6CB
Flowing Breeze
- CDC0BB
≈ Vintage Taupe
Analogowa -30° +30°
- B9C6CB
Flowing Breeze
- B8C7C6
≈ Misty Surf
- BCC4CE
≈ Blue Dolphin
Triada +120° +240°
- B9C6CB
Flowing Breeze
- CBC0C6
≈ Silk Chiffon
- C5C4B8
≈ Grey Ashlar
Komplementarna rozszczepiona +150° +210°
- B9C6CB
Flowing Breeze
- CEBFC0
≈ Dusky Violet
- CAC2B9
≈ Pumice Stone
Tetrada +90° +180° +270°
- B9C6CB
Flowing Breeze
- C7C1CB
≈ Lavender Vapour
- CDC0BB
≈ Vintage Taupe
- BFC6BB
≈ Contemplation
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.74:1 · APCA Lc 32
Ag
AAANa czerni
WCAG 12.00:1 · APCA Lc 71
Najlepszy kolor tekstu: #000000
WCAG 12.00:1 (AAA) · APCA Lc 71
Contrast pairs
Fragmenty kodu
CSS
:root {
--flowing-breeze: #b9c6cb;
--flowing-breeze-rgb: 185 198 203;
--flowing-breeze-oklch: oklch(0.818 0.016 222.7);
}
.element {
color: var(--flowing-breeze);
background-color: hsl(197 15% 76%);
border-color: oklch(0.818 0.016 222.7);
}Tailwind CSS v4
@theme {
--color-flowing-breeze: #b9c6cb;
--color-flowing-breeze-50: #f1f6f9;
--color-flowing-breeze-100: #e3e9ec;
--color-flowing-breeze-200: #cdd6d9;
--color-flowing-breeze-300: #afb9bd;
--color-flowing-breeze-400: #95a1a5;
--color-flowing-breeze-500: #7b898e;
--color-flowing-breeze-600: #687478;
--color-flowing-breeze-700: #535d60;
--color-flowing-breeze-800: #3d4446;
--color-flowing-breeze-900: #2a2f31;
--color-flowing-breeze-950: #171b1d;
}SCSS
$flowing-breeze: #b9c6cb;
$flowing-breeze-rgb: 185, 198, 203;
$flowing-breeze-light: mix(#fff, $flowing-breeze, 20%);
$flowing-breeze-dark: mix(#000, $flowing-breeze, 20%);
.element {
color: $flowing-breeze;
box-shadow: 0 0 0 2px rgba($flowing-breeze, 0.35);
}