Adlandırılmış renk · #71898D
Twilight Stroll
Twilight Stroll, #71898D: rgb(113 137 141), hsl(189 11% 50%), oklch(0.613 0.028 208.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Twilight Stroll color name →
#71898D
oklch(0.613 0.028 208.8)
Renk dönüşümleri
- HEX
- #71898d
- RGB
- rgb(113 137 141)
- HSL
- hsl(189 11% 50%)
- HWB
- hwb(189 44% 45%)
- OKLCH
- oklch(0.613 0.028 208.8)
- OKLab
- oklab(0.613 -0.025 -0.014)
- CIE Lab
- lab(55.3 -8.21 -5.17)
- LCH
- lch(55.3 9.7 212.2)
- CMYK
- cmyk(20% 3% 0% 45%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 7E9498
- 8CA0A3
- 9AABAE
- A8B7B9
- B6C2C4
- C4CED0
- D3DADC
- E1E6E7
- F0F3F3
Koyu tonlar
- 61767A
- 526467
- 435355
- 354244
- 273133
- 1A2223
- 0E1414
- 040707
- 010101
Gri tonlar
- 73888C
- 74878A
- 768689
- 778588
- 798587
- 7A8485
- 7C8384
- 7D8283
- 7F8181
Renk uyumları
Tamamlayıcı +180°
- 71898D
Twilight Stroll
- 947E7A
≈ Warplock Bronze Metal
Analog -30° +30°
- 71898D
Twilight Stroll
- 728A84
≈ Misty Moor
- 758793
≈ Skipper
Üçlü +120° +240°
- 71898D
Twilight Stroll
- 8E7E8C
≈ Iced Orchid
- 8B8371
≈ Hardware
Bölünmüş tamamlayıcı +150° +210°
- 71898D
Twilight Stroll
- 937D84
≈ Purple Dove
- 918074
≈ Roasted Cashew
Dörtlü +90° +180° +270°
- 71898D
Twilight Stroll
- 868193
≈ Mecha Metal
- 947E7A
≈ Warplock Bronze Metal
- 828774
≈ Cottage Lattice Green
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.70:1 · APCA Lc 65
Ag
AASiyah üzerinde
WCAG 5.66:1 · APCA Lc 37
En iyi metin rengi: #000000
WCAG 5.66:1 (AA) · APCA Lc 37
Contrast pairs
Kod parçacıkları
CSS
:root {
--twilight-stroll: #71898d;
--twilight-stroll-rgb: 113 137 141;
--twilight-stroll-oklch: oklch(0.613 0.028 208.8);
}
.element {
color: var(--twilight-stroll);
background-color: hsl(189 11% 50%);
border-color: oklch(0.613 0.028 208.8);
}Tailwind CSS v4
@theme {
--color-twilight-stroll: #71898d;
--color-twilight-stroll-50: #edf7fa;
--color-twilight-stroll-100: #deebed;
--color-twilight-stroll-200: #c7d8db;
--color-twilight-stroll-300: #a8bcbf;
--color-twilight-stroll-400: #8ca3a7;
--color-twilight-stroll-500: #718c90;
--color-twilight-stroll-600: #60767a;
--color-twilight-stroll-700: #4d5f62;
--color-twilight-stroll-800: #374547;
--color-twilight-stroll-900: #263031;
--color-twilight-stroll-950: #141c1d;
}SCSS
$twilight-stroll: #71898d;
$twilight-stroll-rgb: 113, 137, 141;
$twilight-stroll-light: mix(#fff, $twilight-stroll, 20%);
$twilight-stroll-dark: mix(#000, $twilight-stroll, 20%);
.element {
color: $twilight-stroll;
box-shadow: 0 0 0 2px rgba($twilight-stroll, 0.35);
}