Adlandırılmış renk · #57465D
Conspiracy Velvet
Conspiracy Velvet, #57465D: rgb(87 70 93), hsl(284 14% 32%), oklch(0.421 0.043 317.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Purple mean? → · Conspiracy Velvet color name →
#57465D
oklch(0.421 0.043 317.2)
Renk dönüşümleri
- HEX
- #57465d
- RGB
- rgb(87 70 93)
- HSL
- hsl(284 14% 32%)
- HWB
- hwb(284 27% 64%)
- OKLCH
- oklch(0.421 0.043 317.2)
- OKLab
- oklab(0.421 0.032 -0.029)
- CIE Lab
- lab(32.2 11.04 -10.81)
- LCH
- lch(32.2 15.45 315.6)
- CMYK
- cmyk(6% 25% 0% 64%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 66576C
- 76687B
- 86798B
- 978B9B
- A79EAB
- B8B0BB
- CAC4CC
- DBD7DD
- EDEBEE
Koyu tonlar
- 4B3C50
- 3E3243
- 332837
- 271E2A
- 1C151F
- 120D14
- 08050A
- 030203
- 000000
Gri tonlar
- 5B4C61
- 5F5164
- 635768
- 675D6B
- 6B626E
- 6F6872
- 746E75
- 787479
- 7C7A7C
Renk uyumları
Tamamlayıcı +180°
- 57465D
Conspiracy Velvet
- 42533C
≈ Okroshka
Analog -30° +30°
- 57465D
Conspiracy Velvet
- 4B4A64
≈ Blue Suede Shoes
- 5F4452
≈ Plummy Rouge
Üçlü +120° +240°
- 57465D
Conspiracy Velvet
- 5B4A32
≈ Hóng Zōng Brown
- 2F5555
≈ Hidden Depths
Bölünmüş tamamlayıcı +150° +210°
- 57465D
Conspiracy Velvet
- 504F33
≈ Jungle King
- 355548
≈ Leprechaun Green
Dörtlü +90° +180° +270°
- 57465D
Conspiracy Velvet
- 614639
≈ Fairfax Brown
- 42533C
≈ Okroshka
- 335260
≈ Wentworth
Kontrast ve erişilebilirlik
Ag
AAABeyaz üzerinde
WCAG 8.60:1 · APCA Lc 90
Ag
FailSiyah üzerinde
WCAG 2.43:1 · APCA Lc 13
En iyi metin rengi: #FFFFFF
WCAG 8.60:1 (AAA) · APCA Lc 90
Contrast pairs
Kod parçacıkları
CSS
:root {
--conspiracy-velvet: #57465d;
--conspiracy-velvet-rgb: 87 70 93;
--conspiracy-velvet-oklch: oklch(0.421 0.043 317.2);
}
.element {
color: var(--conspiracy-velvet);
background-color: hsl(284 14% 32%);
border-color: oklch(0.421 0.043 317.2);
}Tailwind CSS v4
@theme {
--color-conspiracy-velvet: #57465d;
--color-conspiracy-velvet-50: #fbf1fd;
--color-conspiracy-velvet-100: #eee4f1;
--color-conspiracy-velvet-200: #ddcfe0;
--color-conspiracy-velvet-300: #c1b1c6;
--color-conspiracy-velvet-400: #a997b0;
--color-conspiracy-velvet-500: #927e99;
--color-conspiracy-velvet-600: #7c6a82;
--color-conspiracy-velvet-700: #635568;
--color-conspiracy-velvet-800: #483e4d;
--color-conspiracy-velvet-900: #322b35;
--color-conspiracy-velvet-950: #1e1821;
}SCSS
$conspiracy-velvet: #57465d;
$conspiracy-velvet-rgb: 87, 70, 93;
$conspiracy-velvet-light: mix(#fff, $conspiracy-velvet, 20%);
$conspiracy-velvet-dark: mix(#000, $conspiracy-velvet, 20%);
.element {
color: $conspiracy-velvet;
box-shadow: 0 0 0 2px rgba($conspiracy-velvet, 0.35);
}