Nazwany kolor · #C3C4D6
Tulip Soft Blue
Tulip Soft Blue to #C3C4D6: rgb(195 196 214), hsl(237 19% 80%), oklch(0.825 0.025 283.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Tulip Soft Blue color name →
#C3C4D6
oklch(0.825 0.025 283.3)
Konwersje koloru
- HEX
- #c3c4d6
- RGB
- rgb(195 196 214)
- HSL
- hsl(237 19% 80%)
- HWB
- hwb(237 76% 16%)
- OKLCH
- oklch(0.825 0.025 283.3)
- OKLab
- oklab(0.825 0.006 -0.024)
- CIE Lab
- lab(79.49 2.23 -9.14)
- LCH
- lch(79.49 9.41 283.7)
- CMYK
- cmyk(9% 8% 0% 16%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C9CADA
- CFD0DE
- D5D5E2
- DBDBE6
- E1E1EA
- E7E7EF
- EDEDF3
- F3F3F7
- F9F9FB
Odcienie ciemniejsze
- A9AABA
- 90919E
- 787884
- 60616A
- 4A4A52
- 34353B
- 202125
- 0E0E10
- 020202
Tony
- BCBDCD
- B5B6C4
- AEAFBB
- A8A8B3
- A1A1AA
- 9A9BA1
- 949499
- 8D8D91
- 868788
Harmonie kolorów
Komplementarna +180°
- C3C4D6
Tulip Soft Blue
- C8C7B4
≈ Wabi-Sabi
Analogowa -30° +30°
- C3C4D6
Tulip Soft Blue
- BBC7D6
≈ Angelic Blue
- CCC1D2
≈ Powder Viola
Triada +120° +240°
- C3C4D6
Tulip Soft Blue
- D5C1B9
≈ New Wool
- B8CBC1
≈ Blue Shamrock
Komplementarna rozszczepiona +150° +210°
- C3C4D6
Tulip Soft Blue
- D0C4B4
≈ Sunray Venus
- BFCAB9
≈ Jade Light Green
Tetrada +90° +180° +270°
- C3C4D6
Tulip Soft Blue
- D6C0C1
≈ Sprig Muslin
- C8C7B4
≈ Wabi-Sabi
- B4CBCA
≈ Clear Pond
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.72:1 · APCA Lc 31
Ag
AAANa czerni
WCAG 12.18:1 · APCA Lc 72
Najlepszy kolor tekstu: #000000
WCAG 12.18:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--tulip-soft-blue: #c3c4d6;
--tulip-soft-blue-rgb: 195 196 214;
--tulip-soft-blue-oklch: oklch(0.825 0.025 283.3);
}
.element {
color: var(--tulip-soft-blue);
background-color: hsl(237 19% 80%);
border-color: oklch(0.825 0.025 283.3);
}Tailwind CSS v4
@theme {
--color-tulip-soft-blue: #c3c4d6;
--color-tulip-soft-blue-50: #f4f4fc;
--color-tulip-soft-blue-100: #e7e7f0;
--color-tulip-soft-blue-200: #d3d3df;
--color-tulip-soft-blue-300: #b6b6c4;
--color-tulip-soft-blue-400: #9c9dad;
--color-tulip-soft-blue-500: #838497;
--color-tulip-soft-blue-600: #6f707f;
--color-tulip-soft-blue-700: #595a66;
--color-tulip-soft-blue-800: #41414b;
--color-tulip-soft-blue-900: #2d2d34;
--color-tulip-soft-blue-950: #1a1a20;
}SCSS
$tulip-soft-blue: #c3c4d6;
$tulip-soft-blue-rgb: 195, 196, 214;
$tulip-soft-blue-light: mix(#fff, $tulip-soft-blue, 20%);
$tulip-soft-blue-dark: mix(#000, $tulip-soft-blue, 20%);
.element {
color: $tulip-soft-blue;
box-shadow: 0 0 0 2px rgba($tulip-soft-blue, 0.35);
}