Nazwany kolor · #A9A3A4
Crystal Noir
Crystal Noir to #A9A3A4: rgb(169 163 164), hsl(350 3% 65%), oklch(0.721 0.007 5.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Crystal Noir color name →
#A9A3A4
oklch(0.721 0.007 5.7)
Konwersje koloru
- HEX
- #a9a3a4
- RGB
- rgb(169 163 164)
- HSL
- hsl(350 3% 65%)
- HWB
- hwb(350 64% 34%)
- OKLCH
- oklch(0.721 0.007 5.7)
- OKLab
- oklab(0.721 0.007 0.001)
- CIE Lab
- lab(67.53 2.38 0.29)
- LCH
- lch(67.53 2.4 7)
- CMYK
- cmyk(0% 4% 3% 34%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B1ACAD
- BAB5B6
- C2BEBF
- CBC7C7
- D3D0D1
- DCD9DA
- E5E3E3
- EDECEC
- F6F5F6
Odcienie ciemniejsze
- 928D8E
- 7C7879
- 676364
- 534F50
- 3F3C3D
- 2C2A2B
- 1B191A
- 0A0A0A
- 010101
Tony
- A59FA0
- A19C9D
- 9C9899
- 989595
- 949192
- 908E8E
- 8C8A8B
- 888787
- 848384
Harmonie kolorów
Komplementarna +180°
- A9A3A4
Crystal Noir
- A0A6A5
≈ Castlegate
Analogowa -30° +30°
- A9A3A4
Crystal Noir
- A8A3A6
≈ Crystal Noir
- A9A3A2
≈ Crystal Noir
Triada +120° +240°
- A9A3A4
Crystal Noir
- A4A6A1
≈ Great Graphite
- A1A5A9
≈ Baby Seal
Komplementarna rozszczepiona +150° +210°
- A9A3A4
Crystal Noir
- A1A6A3
≈ Chain Reaction
- A0A6A8
≈ Chance of Rain
Tetrada +90° +180° +270°
- A9A3A4
Crystal Noir
- A6A5A0
≈ Hazy Stratus
- A0A6A5
≈ Castlegate
- A3A4A9
≈ Lionfish
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.48:1 · APCA Lc 49
Ag
AAANa czerni
WCAG 8.46:1 · APCA Lc 53
Najlepszy kolor tekstu: #000000
WCAG 8.46:1 (AAA) · APCA Lc 53
Contrast pairs
Fragmenty kodu
CSS
:root {
--crystal-noir: #a9a3a4;
--crystal-noir-rgb: 169 163 164;
--crystal-noir-oklch: oklch(0.721 0.007 5.7);
}
.element {
color: var(--crystal-noir);
background-color: hsl(350 3% 65%);
border-color: oklch(0.721 0.007 5.7);
}Tailwind CSS v4
@theme {
--color-crystal-noir: #a9a3a4;
--color-crystal-noir-50: #f7f4f5;
--color-crystal-noir-100: #eae7e7;
--color-crystal-noir-200: #d7d3d3;
--color-crystal-noir-300: #bbb6b7;
--color-crystal-noir-400: #a29d9e;
--color-crystal-noir-500: #8b8485;
--color-crystal-noir-600: #757071;
--color-crystal-noir-700: #5e595a;
--color-crystal-noir-800: #454142;
--color-crystal-noir-900: #2f2d2e;
--color-crystal-noir-950: #1c1a1a;
}SCSS
$crystal-noir: #a9a3a4;
$crystal-noir-rgb: 169, 163, 164;
$crystal-noir-light: mix(#fff, $crystal-noir, 20%);
$crystal-noir-dark: mix(#000, $crystal-noir, 20%);
.element {
color: $crystal-noir;
box-shadow: 0 0 0 2px rgba($crystal-noir, 0.35);
}