Nazwany kolor · #BBC8C9
Oceanic Climate
Oceanic Climate to #BBC8C9: rgb(187 200 201), hsl(184 11% 76%), oklch(0.823 0.014 202.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Oceanic Climate color name →
#BBC8C9
oklch(0.823 0.014 202.4)
Konwersje koloru
- HEX
- #bbc8c9
- RGB
- rgb(187 200 201)
- HSL
- hsl(184 11% 76%)
- HWB
- hwb(184 73% 21%)
- OKLCH
- oklch(0.823 0.014 202.4)
- OKLab
- oklab(0.823 -0.013 -0.005)
- CIE Lab
- lab(79.62 -4.45 -2.11)
- LCH
- lch(79.62 4.93 205.4)
- CMYK
- cmyk(7% 0% 0% 21%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C2CDCE
- C8D3D4
- CFD8D9
- D6DEDE
- DDE3E4
- E3E9E9
- EAEEEF
- F1F4F4
- F8F9F9
Odcienie ciemniejsze
- A2AEAE
- 8A9495
- 737B7C
- 5C6364
- 464C4C
- 323636
- 1F2122
- 0D0F0F
- 020202
Tony
- B5C1C1
- AFB9BA
- A9B2B2
- A3ABAB
- 9DA3A4
- 979C9C
- 919595
- 8C8E8E
- 868787
Harmonie kolorów
Komplementarna +180°
- BBC8C9
Oceanic Climate
- CEC2C1
≈ Wishy-Washy Brown
Analogowa -30° +30°
- BBC8C9
Oceanic Climate
- BCC8C4
≈ Smoke
- BCC7CD
≈ Gris Náutico
Triada +120° +240°
- BBC8C9
Oceanic Climate
- CAC2CB
≈ Limpid Light
- CAC4BB
≈ Pavestone
Komplementarna rozszczepiona +150° +210°
- BBC8C9
Oceanic Climate
- CDC1C6
≈ Sun Painter
- CDC3BD
≈ In the Shadows
Tetrada +90° +180° +270°
- BBC8C9
Oceanic Climate
- C5C4CE
≈ Posture & Pose
- CEC2C1
≈ Wishy-Washy Brown
- C5C6BC
≈ Notre Dame
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.71:1 · APCA Lc 31
Ag
AAANa czerni
WCAG 12.21:1 · APCA Lc 72
Najlepszy kolor tekstu: #000000
WCAG 12.21:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--oceanic-climate: #bbc8c9;
--oceanic-climate-rgb: 187 200 201;
--oceanic-climate-oklch: oklch(0.823 0.014 202.4);
}
.element {
color: var(--oceanic-climate);
background-color: hsl(184 11% 76%);
border-color: oklch(0.823 0.014 202.4);
}Tailwind CSS v4
@theme {
--color-oceanic-climate: #bbc8c9;
--color-oceanic-climate-50: #f1f6f7;
--color-oceanic-climate-100: #e3e9ea;
--color-oceanic-climate-200: #ced6d7;
--color-oceanic-climate-300: #afbabb;
--color-oceanic-climate-400: #95a1a2;
--color-oceanic-climate-500: #7c898a;
--color-oceanic-climate-600: #697475;
--color-oceanic-climate-700: #545d5e;
--color-oceanic-climate-800: #3d4444;
--color-oceanic-climate-900: #2a2f2f;
--color-oceanic-climate-950: #171b1c;
}SCSS
$oceanic-climate: #bbc8c9;
$oceanic-climate-rgb: 187, 200, 201;
$oceanic-climate-light: mix(#fff, $oceanic-climate, 20%);
$oceanic-climate-dark: mix(#000, $oceanic-climate, 20%);
.element {
color: $oceanic-climate;
box-shadow: 0 0 0 2px rgba($oceanic-climate, 0.35);
}