Nazwany kolor · #99C1DC
January Frost
January Frost to #99C1DC: rgb(153 193 220), hsl(204 49% 73%), oklch(0.791 0.057 238). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · January Frost color name →
#99C1DC
oklch(0.791 0.057 238)
Konwersje koloru
- HEX
- #99c1dc
- RGB
- rgb(153 193 220)
- HSL
- hsl(204 49% 73%)
- HWB
- hwb(204 60% 14%)
- OKLCH
- oklch(0.791 0.057 238)
- OKLab
- oklab(0.791 -0.03 -0.049)
- CIE Lab
- lab(75.86 -9.06 -18.14)
- LCH
- lch(75.86 20.28 243.5)
- CMYK
- cmyk(30% 12% 0% 14%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A3C7E0
- ADCDE3
- B7D3E7
- C2DAEA
- CCE0EE
- D6E6F1
- E0ECF5
- EAF3F8
- F5F9FC
Odcienie ciemniejsze
- 84A7BF
- 708FA3
- 5D7788
- 4A5F6E
- 384954
- 27343C
- 172026
- 080E11
- 010202
Tony
- 97BAD2
- 94B4C9
- 92ADC0
- 90A7B6
- 8DA0AD
- 8B9AA4
- 88939B
- 858D92
- 838689
Harmonie kolorów
Komplementarna +180°
- 99C1DC
January Frost
- D8B297
≈ Blonde Lace
Analogowa -30° +30°
- 99C1DC
January Frost
- 90C6CE
≈ Cerulean Skies
- ABBAE1
≈ French Lilac Blue
Triada +120° +240°
- 99C1DC
January Frost
- DBACBB
≈ Apple Infusion
- B7C097
≈ Beige and Sage
Komplementarna rozszczepiona +150° +210°
- 99C1DC
January Frost
- DEAEA7
≈ Pale Blush
- CAB991
≈ Flier Lie
Tetrada +90° +180° +270°
- 99C1DC
January Frost
- D0AECE
≈ Orchid Bouquet
- D8B297
≈ Blonde Lace
- A3C6A7
≈ Aroma Garden
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.90:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.01:1 · APCA Lc 66
Najlepszy kolor tekstu: #000000
WCAG 11.01:1 (AAA) · APCA Lc 66
Contrast pairs
Fragmenty kodu
CSS
:root {
--january-frost: #99c1dc;
--january-frost-rgb: 153 193 220;
--january-frost-oklch: oklch(0.791 0.057 238);
}
.element {
color: var(--january-frost);
background-color: hsl(204 49% 73%);
border-color: oklch(0.791 0.057 238);
}Tailwind CSS v4
@theme {
--color-january-frost: #99c1dc;
--color-january-frost-50: #e7f8ff;
--color-january-frost-100: #d7ebfa;
--color-january-frost-200: #bfd8eb;
--color-january-frost-300: #9ebcd2;
--color-january-frost-400: #7fa4bd;
--color-january-frost-500: #618ca8;
--color-january-frost-600: #53778e;
--color-january-frost-700: #425f72;
--color-january-frost-800: #2f4654;
--color-january-frost-900: #20303a;
--color-january-frost-950: #0f1c24;
}SCSS
$january-frost: #99c1dc;
$january-frost-rgb: 153, 193, 220;
$january-frost-light: mix(#fff, $january-frost, 20%);
$january-frost-dark: mix(#000, $january-frost, 20%);
.element {
color: $january-frost;
box-shadow: 0 0 0 2px rgba($january-frost, 0.35);
}