Nazwany kolor · #C6CBDB
Lavender Steel
Lavender Steel to #C6CBDB: rgb(198 203 219), hsl(226 23% 82%), oklch(0.843 0.023 272). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Lavender Steel color name →
#C6CBDB
oklch(0.843 0.023 272)
Konwersje koloru
- HEX
- #c6cbdb
- RGB
- rgb(198 203 219)
- HSL
- hsl(226 23% 82%)
- HWB
- hwb(226 78% 14%)
- OKLCH
- oklch(0.843 0.023 272)
- OKLab
- oklab(0.843 0.001 -0.023)
- CIE Lab
- lab(81.66 0.54 -8.6)
- LCH
- lch(81.66 8.61 273.6)
- CMYK
- cmyk(10% 7% 0% 14%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CCD0DF
- D1D5E2
- D7DAE6
- DCE0E9
- E2E5ED
- E8EAF1
- EEEFF4
- F3F4F8
- F9FAFB
Odcienie ciemniejsze
- ACB0BE
- 9296A2
- 7A7D87
- 62656D
- 4B4D54
- 35373C
- 212226
- 0E0F11
- 020202
Tony
- BFC3D2
- B8BCC8
- B0B4BF
- A9ACB6
- A2A5AC
- 9B9DA3
- 94969A
- 8E8E92
- 878789
Harmonie kolorów
Komplementarna +180°
- C6CBDB
Lavender Steel
- D1CBBB
≈ Shoreline Haze
Analogowa -30° +30°
- C6CBDB
Lavender Steel
- BFCED9
≈ Winter Scene
- CEC8D8
≈ Moon Goddess
Triada +120° +240°
- C6CBDB
Lavender Steel
- DAC6C2
≈ Fairview Taupe
- C1D0C4
≈ Opaline
Komplementarna rozszczepiona +150° +210°
- C6CBDB
Lavender Steel
- D7C9BD
≈ Old Map
- C9CEBE
≈ Frosty Pine
Tetrada +90° +180° +270°
- C6CBDB
Lavender Steel
- D9C6CA
≈ Odyssey Lilac
- D1CBBB
≈ Shoreline Haze
- BCD1CC
≈ Déjà Vu
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.61:1 · APCA Lc 28
Ag
AAANa czerni
WCAG 12.96:1 · APCA Lc 75
Najlepszy kolor tekstu: #000000
WCAG 12.96:1 (AAA) · APCA Lc 75
Contrast pairs
Fragmenty kodu
CSS
:root {
--lavender-steel: #c6cbdb;
--lavender-steel-rgb: 198 203 219;
--lavender-steel-oklch: oklch(0.843 0.023 272);
}
.element {
color: var(--lavender-steel);
background-color: hsl(226 23% 82%);
border-color: oklch(0.843 0.023 272);
}Tailwind CSS v4
@theme {
--color-lavender-steel: #c6cbdb;
--color-lavender-steel-50: #f3f5fc;
--color-lavender-steel-100: #e5e7f0;
--color-lavender-steel-200: #d1d4de;
--color-lavender-steel-300: #b3b7c3;
--color-lavender-steel-400: #999eac;
--color-lavender-steel-500: #818696;
--color-lavender-steel-600: #6d717f;
--color-lavender-steel-700: #575a65;
--color-lavender-steel-800: #3f424b;
--color-lavender-steel-900: #2b2e34;
--color-lavender-steel-950: #191a1f;
}SCSS
$lavender-steel: #c6cbdb;
$lavender-steel-rgb: 198, 203, 219;
$lavender-steel-light: mix(#fff, $lavender-steel, 20%);
$lavender-steel-dark: mix(#000, $lavender-steel, 20%);
.element {
color: $lavender-steel;
box-shadow: 0 0 0 2px rgba($lavender-steel, 0.35);
}