Adlandırılmış renk · #61736F
Drifting Downstream
Drifting Downstream, #61736F: rgb(97 115 111), hsl(167 8% 42%), oklch(0.54 0.022 180.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Drifting Downstream color name →
#61736F
oklch(0.54 0.022 180.5)
Renk dönüşümleri
- HEX
- #61736f
- RGB
- rgb(97 115 111)
- HSL
- hsl(167 8% 42%)
- HWB
- hwb(167 38% 55%)
- OKLCH
- oklch(0.54 0.022 180.5)
- OKLab
- oklab(0.54 -0.022 0)
- CIE Lab
- lab(46.86 -7.6 -0.14)
- LCH
- lch(46.86 7.6 181.1)
- CMYK
- cmyk(16% 0% 3% 55%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 70807C
- 7F8D8A
- 8E9B98
- 9DA9A6
- ADB7B4
- BDC5C3
- CDD3D2
- DEE1E1
- EEF0F0
Koyu tonlar
- 536360
- 465451
- 394542
- 2D3634
- 212827
- 151B1A
- 0B0F0E
- 030504
- 000101
Gri tonlar
- 647471
- 677672
- 6A7774
- 6D7876
- 717A77
- 747B79
- 777C7B
- 7A7D7D
- 7D7F7E
Renk uyumları
Tamamlayıcı +180°
- 61736F
Drifting Downstream
- 7A696E
≈ Gothic Spire
Analog -30° +30°
- 61736F
Drifting Downstream
- 667268
≈ Queen Valley
- 607276
≈ Goblin Blue
Üçlü +120° +240°
- 61736F
Drifting Downstream
- 706C7A
≈ Space Station
- 796C62
≈ Trailhead
Bölünmüş tamamlayıcı +150° +210°
- 61736F
Drifting Downstream
- 766A75
≈ Purposeful
- 7B6A67
≈ Muscatel
Dörtlü +90° +180° +270°
- 61736F
Drifting Downstream
- 696E7C
≈ Nouveau
- 7A696E
≈ Gothic Spire
- 736E60
≈ Randall
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 5.01:1 · APCA Lc 75
Ag
FailSiyah üzerinde
WCAG 4.19:1 · APCA Lc 27
En iyi metin rengi: #FFFFFF
WCAG 5.01:1 (AA) · APCA Lc 75
Contrast pairs
Kod parçacıkları
CSS
:root {
--drifting-downstream: #61736f;
--drifting-downstream-rgb: 97 115 111;
--drifting-downstream-oklch: oklch(0.54 0.022 180.5);
}
.element {
color: var(--drifting-downstream);
background-color: hsl(167 8% 42%);
border-color: oklch(0.54 0.022 180.5);
}Tailwind CSS v4
@theme {
--color-drifting-downstream: #61736f;
--color-drifting-downstream-50: #eff7f6;
--color-drifting-downstream-100: #e0eae8;
--color-drifting-downstream-200: #cad7d5;
--color-drifting-downstream-300: #acbbb8;
--color-drifting-downstream-400: #91a39f;
--color-drifting-downstream-500: #778b87;
--color-drifting-downstream-600: #657672;
--color-drifting-downstream-700: #505e5b;
--color-drifting-downstream-800: #3a4542;
--color-drifting-downstream-900: #28302e;
--color-drifting-downstream-950: #161c1b;
}SCSS
$drifting-downstream: #61736f;
$drifting-downstream-rgb: 97, 115, 111;
$drifting-downstream-light: mix(#fff, $drifting-downstream, 20%);
$drifting-downstream-dark: mix(#000, $drifting-downstream, 20%);
.element {
color: $drifting-downstream;
box-shadow: 0 0 0 2px rgba($drifting-downstream, 0.35);
}