Nazwany kolor · #685E4F
Spooky Graveyard
Spooky Graveyard to #685E4F: rgb(104 94 79), hsl(36 14% 36%), oklch(0.487 0.026 78). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Spooky Graveyard color name →
#685E4F
oklch(0.487 0.026 78)
Konwersje koloru
- HEX
- #685e4f
- RGB
- rgb(104 94 79)
- HSL
- hsl(36 14% 36%)
- HWB
- hwb(36 31% 59%)
- OKLCH
- oklch(0.487 0.026 78)
- OKLab
- oklab(0.487 0.006 0.026)
- CIE Lab
- lab(40.54 2.17 10.18)
- LCH
- lch(40.54 10.41 77.9)
- CMYK
- cmyk(0% 10% 24% 59%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 766D5F
- 847C6F
- 938B80
- A29B91
- B1ABA3
- C0BBB5
- CFCCC7
- DFDDD9
- EFEEEC
Odcienie ciemniejsze
- 595144
- 4B4438
- 3E372E
- 302B23
- 241F19
- 181410
- 0C0A07
- 040302
- 000000
Tony
- 6A6154
- 6D6559
- 6F685D
- 726B62
- 746F67
- 76726C
- 797671
- 7B7976
- 7E7D7B
Harmonie kolorów
Komplementarna +180°
- 685E4F
Spooky Graveyard
- 56606F
≈ Sheet Blue
Analogowa -30° +30°
- 685E4F
Spooky Graveyard
- 6D5B53
≈ Oiled Teak
- 616150
≈ Bull Kelp
Triada +120° +240°
- 685E4F
Spooky Graveyard
- 4E6465
≈ Wellington
- 665B6A
≈ Patina Violet
Komplementarna rozszczepiona +150° +210°
- 685E4F
Spooky Graveyard
- 50636C
≈ Masuhana Blue
- 5E5D6E
≈ Smoky
Tetrada +90° +180° +270°
- 685E4F
Spooky Graveyard
- 51655D
≈ Obligation
- 56606F
≈ Sheet Blue
- 6C5A62
≈ Aubergine Grey
Kontrast i dostępność
Ag
AANa bieli
WCAG 6.35:1 · APCA Lc 82
Ag
FailNa czerni
WCAG 3.30:1 · APCA Lc 20
Najlepszy kolor tekstu: #FFFFFF
WCAG 6.35:1 (AA) · APCA Lc 82
Contrast pairs
Fragmenty kodu
CSS
:root {
--spooky-graveyard: #685e4f;
--spooky-graveyard-rgb: 104 94 79;
--spooky-graveyard-oklch: oklch(0.487 0.026 78);
}
.element {
color: var(--spooky-graveyard);
background-color: hsl(36 14% 36%);
border-color: oklch(0.487 0.026 78);
}Tailwind CSS v4
@theme {
--color-spooky-graveyard: #685e4f;
--color-spooky-graveyard-50: #f9f4ed;
--color-spooky-graveyard-100: #ede7de;
--color-spooky-graveyard-200: #dad3c8;
--color-spooky-graveyard-300: #bfb6a9;
--color-spooky-graveyard-400: #a79d8d;
--color-spooky-graveyard-500: #908473;
--color-spooky-graveyard-600: #7a7061;
--color-spooky-graveyard-700: #615a4e;
--color-spooky-graveyard-800: #484138;
--color-spooky-graveyard-900: #322d27;
--color-spooky-graveyard-950: #1e1a15;
}SCSS
$spooky-graveyard: #685e4f;
$spooky-graveyard-rgb: 104, 94, 79;
$spooky-graveyard-light: mix(#fff, $spooky-graveyard, 20%);
$spooky-graveyard-dark: mix(#000, $spooky-graveyard, 20%);
.element {
color: $spooky-graveyard;
box-shadow: 0 0 0 2px rgba($spooky-graveyard, 0.35);
}