Nazwany kolor · #C0D6EA
Pacific Panorama
Pacific Panorama to #C0D6EA: rgb(192 214 234), hsl(209 50% 84%), oklch(0.866 0.037 245.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Pacific Panorama color name →
#C0D6EA
oklch(0.866 0.037 245.7)
Konwersje koloru
- HEX
- #c0d6ea
- RGB
- rgb(192 214 234)
- HSL
- hsl(209 50% 84%)
- HWB
- hwb(209 75% 8%)
- OKLCH
- oklch(0.866 0.037 245.7)
- OKLab
- oklab(0.866 -0.015 -0.033)
- CIE Lab
- lab(84.44 -4.54 -12.49)
- LCH
- lch(84.44 13.29 250)
- CMYK
- cmyk(18% 9% 0% 8%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C6DAEC
- CCDEEE
- D3E2F0
- D9E6F3
- DFEAF5
- E6EFF7
- ECF3F9
- F2F7FB
- F9FBFD
Odcienie ciemniejsze
- A7BACB
- 8E9EAE
- 768491
- 5F6A75
- 49525A
- 343B41
- 202529
- 0E1013
- 020203
Tony
- B9CDDF
- B3C4D4
- ACBBC9
- A6B3BE
- A0AAB4
- 99A1A9
- 93999F
- 8D9194
- 86888A
Harmonie kolorów
Komplementarna +180°
- C0D6EA
Pacific Panorama
- E4CFBA
≈ Biscuit Crumbs
Analogowa -30° +30°
- C0D6EA
Pacific Panorama
- B9DAE2
≈ Alpine Alabaster
- CCD2EC
≈ Garden Fairy
Triada +120° +240°
- C0D6EA
Pacific Panorama
- E9CACF
≈ Pink Slipper
- CDD8BE
≈ Celery Satin
Komplementarna rozszczepiona +150° +210°
- C0D6EA
Pacific Panorama
- EACBC3
≈ Harmony
- DAD3B9
≈ Quill
Tetrada +90° +180° +270°
- C0D6EA
Pacific Panorama
- E3CADC
≈ Wisteria Whisper
- E4CFBA
≈ Biscuit Crumbs
- C1DBC9
≈ Quintessential
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.49:1 · APCA Lc 23
Ag
AAANa czerni
WCAG 14.04:1 · APCA Lc 80
Najlepszy kolor tekstu: #000000
WCAG 14.04:1 (AAA) · APCA Lc 80
Contrast pairs
Fragmenty kodu
CSS
:root {
--pacific-panorama: #c0d6ea;
--pacific-panorama-rgb: 192 214 234;
--pacific-panorama-oklch: oklch(0.866 0.037 245.7);
}
.element {
color: var(--pacific-panorama);
background-color: hsl(209 50% 84%);
border-color: oklch(0.866 0.037 245.7);
}Tailwind CSS v4
@theme {
--color-pacific-panorama: #c0d6ea;
--color-pacific-panorama-50: #edf6ff;
--color-pacific-panorama-100: #dfe9f4;
--color-pacific-panorama-200: #c8d6e3;
--color-pacific-panorama-300: #a9baca;
--color-pacific-panorama-400: #8da1b3;
--color-pacific-panorama-500: #73899d;
--color-pacific-panorama-600: #617485;
--color-pacific-panorama-700: #4e5d6b;
--color-pacific-panorama-800: #38444e;
--color-pacific-panorama-900: #262f36;
--color-pacific-panorama-950: #141c21;
}SCSS
$pacific-panorama: #c0d6ea;
$pacific-panorama-rgb: 192, 214, 234;
$pacific-panorama-light: mix(#fff, $pacific-panorama, 20%);
$pacific-panorama-dark: mix(#000, $pacific-panorama, 20%);
.element {
color: $pacific-panorama;
box-shadow: 0 0 0 2px rgba($pacific-panorama, 0.35);
}