Nazwany kolor · #BDC9E4
Twilight Mist
Twilight Mist to #BDC9E4: rgb(189 201 228), hsl(222 42% 82%), oklch(0.835 0.04 266.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Twilight Mist color name →
#BDC9E4
oklch(0.835 0.04 266.5)
Konwersje koloru
- HEX
- #bdc9e4
- RGB
- rgb(189 201 228)
- HSL
- hsl(222 42% 82%)
- HWB
- hwb(222 74% 11%)
- OKLCH
- oklch(0.835 0.04 266.5)
- OKLab
- oklab(0.835 -0.002 -0.04)
- CIE Lab
- lab(80.68 -0.11 -14.92)
- LCH
- lch(80.68 14.92 269.6)
- CMYK
- cmyk(17% 12% 0% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C3CEE7
- CAD4EA
- D0D9EC
- D7DEEF
- DEE4F2
- E4E9F4
- EBEFF7
- F2F4FA
- F8FAFC
Odcienie ciemniejsze
- A4AEC6
- 8C95A9
- 747C8D
- 5D6472
- 474C58
- 33363F
- 1F2228
- 0D0F12
- 020203
Tony
- B7C1DA
- B0BACF
- AAB3C5
- A4ABBB
- 9EA4B1
- 989DA7
- 92959D
- 8C8E93
- 86878A
Harmonie kolorów
Komplementarna +180°
- BDC9E4
Twilight Mist
- D4C8AC
≈ Prairie House
Analogowa -30° +30°
- BDC9E4
Twilight Mist
- B1CEE0
≈ Light Sky Bus
- CBC4E1
≈ Lavender Bliss
Triada +120° +240°
- BDC9E4
Twilight Mist
- E2C0BB
≈ Silver Peony
- B9D1BA
≈ Eucalyptus Leaf
Komplementarna rozszczepiona +150° +210°
- BDC9E4
Twilight Mist
- DEC3B0
≈ Artisan Tea
- C7CDB0
≈ Growing Season
Tetrada +90° +180° +270°
- BDC9E4
Twilight Mist
- E0BFC9
≈ Soap Pink
- D4C8AC
≈ Prairie House
- AFD2C8
≈ Feeling Lucky
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.66:1 · APCA Lc 29
Ag
AAANa czerni
WCAG 12.63:1 · APCA Lc 74
Najlepszy kolor tekstu: #000000
WCAG 12.63:1 (AAA) · APCA Lc 74
Contrast pairs
Fragmenty kodu
CSS
:root {
--twilight-mist: #bdc9e4;
--twilight-mist-rgb: 189 201 228;
--twilight-mist-oklch: oklch(0.835 0.04 266.5);
}
.element {
color: var(--twilight-mist);
background-color: hsl(222 42% 82%);
border-color: oklch(0.835 0.04 266.5);
}Tailwind CSS v4
@theme {
--color-twilight-mist: #bdc9e4;
--color-twilight-mist-50: #f0f5ff;
--color-twilight-mist-100: #e2e8f6;
--color-twilight-mist-200: #cdd4e6;
--color-twilight-mist-300: #afb7cd;
--color-twilight-mist-400: #939eb7;
--color-twilight-mist-500: #7a86a1;
--color-twilight-mist-600: #677188;
--color-twilight-mist-700: #525b6d;
--color-twilight-mist-800: #3b4251;
--color-twilight-mist-900: #292e38;
--color-twilight-mist-950: #171b23;
}SCSS
$twilight-mist: #bdc9e4;
$twilight-mist-rgb: 189, 201, 228;
$twilight-mist-light: mix(#fff, $twilight-mist, 20%);
$twilight-mist-dark: mix(#000, $twilight-mist, 20%);
.element {
color: $twilight-mist;
box-shadow: 0 0 0 2px rgba($twilight-mist, 0.35);
}