Adlandırılmış renk · #9C8AA4
Amethyst Paint
Amethyst Paint, #9C8AA4: rgb(156 138 164), hsl(282 13% 59%), oklch(0.658 0.043 315.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Purple mean? → · Amethyst Paint color name →
#9C8AA4
oklch(0.658 0.043 315.5)
Renk dönüşümleri
- HEX
- #9c8aa4
- RGB
- rgb(156 138 164)
- HSL
- hsl(282 13% 59%)
- HWB
- hwb(282 54% 36%)
- OKLCH
- oklch(0.658 0.043 315.5)
- OKLab
- oklab(0.658 0.031 -0.03)
- CIE Lab
- lab(59.77 10.69 -11.22)
- LCH
- lch(59.77 15.49 313.6)
- CMYK
- cmyk(5% 16% 0% 36%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A695AD
- AFA0B6
- B9ACBF
- C3B7C8
- CCC3D1
- D6CFDA
- E0DBE3
- EBE7EC
- F5F3F6
Koyu tonlar
- 87778E
- 736579
- 5F5364
- 4C4250
- 39323D
- 28222B
- 18141A
- 09070A
- 010101
Gri tonlar
- 9989A0
- 96889D
- 948799
- 918696
- 8E8592
- 8B848E
- 88838B
- 868287
- 838184
Renk uyumları
Tamamlayıcı +180°
- 9C8AA4
Amethyst Paint
- 86987E
≈ Laurel Tree
Analog -30° +30°
- 9C8AA4
Amethyst Paint
- 8F8EAC
≈ Orchilla
- A68797
≈ Evening Pink
Üçlü +120° +240°
- 9C8AA4
Amethyst Paint
- A18E75
≈ Sandy Ridge
- 739A9A
≈ Teal & Tonic
Bölünmüş tamamlayıcı +150° +210°
- 9C8AA4
Amethyst Paint
- 959475
≈ Blanched Thyme
- 799A8B
≈ Parisian Patina
Dörtlü +90° +180° +270°
- 9C8AA4
Amethyst Paint
- A98A7C
≈ Fudgecicle
- 86987E
≈ Laurel Tree
- 7698A6
≈ Palace Intrigue
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.18:1 · APCA Lc 59
Ag
AASiyah üzerinde
WCAG 6.58:1 · APCA Lc 43
En iyi metin rengi: #000000
WCAG 6.58:1 (AA) · APCA Lc 43
Contrast pairs
Kod parçacıkları
CSS
:root {
--amethyst-paint: #9c8aa4;
--amethyst-paint-rgb: 156 138 164;
--amethyst-paint-oklch: oklch(0.658 0.043 315.5);
}
.element {
color: var(--amethyst-paint);
background-color: hsl(282 13% 59%);
border-color: oklch(0.658 0.043 315.5);
}Tailwind CSS v4
@theme {
--color-amethyst-paint: #9c8aa4;
--color-amethyst-paint-50: #faf2fd;
--color-amethyst-paint-100: #eee4f2;
--color-amethyst-paint-200: #dccfe1;
--color-amethyst-paint-300: #c1b1c6;
--color-amethyst-paint-400: #a897b0;
--color-amethyst-paint-500: #917e9a;
--color-amethyst-paint-600: #7b6b82;
--color-amethyst-paint-700: #625568;
--color-amethyst-paint-800: #483e4d;
--color-amethyst-paint-900: #322b36;
--color-amethyst-paint-950: #1e1821;
}SCSS
$amethyst-paint: #9c8aa4;
$amethyst-paint-rgb: 156, 138, 164;
$amethyst-paint-light: mix(#fff, $amethyst-paint, 20%);
$amethyst-paint-dark: mix(#000, $amethyst-paint, 20%);
.element {
color: $amethyst-paint;
box-shadow: 0 0 0 2px rgba($amethyst-paint, 0.35);
}