Adlandırılmış renk · #CDC7D5
Amethyst Tint
Amethyst Tint, #CDC7D5: rgb(205 199 213), hsl(266 14% 81%), oklch(0.839 0.02 305.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Amethyst Tint color name →
#CDC7D5
oklch(0.839 0.02 305.2)
Renk dönüşümleri
- HEX
- #cdc7d5
- RGB
- rgb(205 199 213)
- HSL
- hsl(266 14% 81%)
- HWB
- hwb(266 78% 16%)
- OKLCH
- oklch(0.839 0.02 305.2)
- OKLab
- oklab(0.839 0.012 -0.017)
- CIE Lab
- lab(81.05 4.08 -6.22)
- LCH
- lch(81.05 7.44 303.3)
- CMYK
- cmyk(4% 7% 0% 16%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- D2CCD9
- D7D2DD
- DCD8E1
- E1DDE6
- E6E3EA
- EBE8EE
- F0EEF2
- F5F4F7
- FAF9FB
Koyu tonlar
- B2ADB9
- 98939E
- 7E7A83
- 66626A
- 4E4C51
- 38363A
- 232124
- 0F0E10
- 020202
Gri tonlar
- C5C0CC
- BDB8C3
- B5B1BB
- ADAAB2
- A6A3AA
- 9E9CA1
- 969599
- 8F8E90
- 878788
Renk uyumları
Tamamlayıcı +180°
- CDC7D5
Amethyst Tint
- C7CDBF
≈ Lamb’s Ears
Analog -30° +30°
- CDC7D5
Amethyst Tint
- C6C9D8
≈ Daybreak Beckons
- D3C5CF
≈ Enchant
Üçlü +120° +240°
- CDC7D5
Amethyst Tint
- D4C8BD
≈ Realist Beige
- BCCFCC
≈ Babbling Brook
Bölünmüş tamamlayıcı +150° +210°
- CDC7D5
Amethyst Tint
- CECABC
≈ Useful Beige
- C0CEC4
≈ Piedmont
Dörtlü +90° +180° +270°
- CDC7D5
Amethyst Tint
- D7C6C1
≈ Weathered Hide
- C7CDBF
≈ Lamb’s Ears
- BCCED2
≈ Shhh…
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.65:1 · APCA Lc 29
Ag
AAASiyah üzerinde
WCAG 12.72:1 · APCA Lc 74
En iyi metin rengi: #000000
WCAG 12.72:1 (AAA) · APCA Lc 74
Contrast pairs
Kod parçacıkları
CSS
:root {
--amethyst-tint: #cdc7d5;
--amethyst-tint-rgb: 205 199 213;
--amethyst-tint-oklch: oklch(0.839 0.02 305.2);
}
.element {
color: var(--amethyst-tint);
background-color: hsl(266 14% 81%);
border-color: oklch(0.839 0.02 305.2);
}Tailwind CSS v4
@theme {
--color-amethyst-tint: #cdc7d5;
--color-amethyst-tint-50: #f7f4fa;
--color-amethyst-tint-100: #e9e6ed;
--color-amethyst-tint-200: #d6d2db;
--color-amethyst-tint-300: #bab5c0;
--color-amethyst-tint-400: #a19ca8;
--color-amethyst-tint-500: #898391;
--color-amethyst-tint-600: #746f7b;
--color-amethyst-tint-700: #5d5962;
--color-amethyst-tint-800: #444148;
--color-amethyst-tint-900: #2f2d32;
--color-amethyst-tint-950: #1b1a1e;
}SCSS
$amethyst-tint: #cdc7d5;
$amethyst-tint-rgb: 205, 199, 213;
$amethyst-tint-light: mix(#fff, $amethyst-tint, 20%);
$amethyst-tint-dark: mix(#000, $amethyst-tint, 20%);
.element {
color: $amethyst-tint;
box-shadow: 0 0 0 2px rgba($amethyst-tint, 0.35);
}