Nazwany kolor · #917A75
Porcupine Needles
Porcupine Needles to #917A75: rgb(145 122 117), hsl(11 11% 51%), oklch(0.6 0.03 32.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Porcupine Needles color name →
#917A75
oklch(0.6 0.03 32.3)
Konwersje koloru
- HEX
- #917a75
- RGB
- rgb(145 122 117)
- HSL
- hsl(11 11% 51%)
- HWB
- hwb(11 46% 43%)
- OKLCH
- oklch(0.6 0.03 32.3)
- OKLab
- oklab(0.6 0.025 0.016)
- CIE Lab
- lab(53.31 8.56 6.23)
- LCH
- lch(53.31 10.59 36.1)
- CMYK
- cmyk(0% 16% 19% 43%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9C8782
- A6938F
- B1A09C
- BCADAA
- C7BAB8
- D2C8C6
- DDD5D4
- E8E3E2
- F4F1F0
Odcienie ciemniejsze
- 7D6965
- 6A5955
- 584946
- 463A37
- 352B29
- 251D1C
- 15100F
- 070505
- 010101
Tony
- 8F7B76
- 8E7B77
- 8C7C78
- 8A7C79
- 897D7B
- 877E7C
- 857E7D
- 847F7E
- 827F7F
Harmonie kolorów
Komplementarna +180°
- 917A75
Porcupine Needles
- 6C858B
≈ Indigo Mouse
Analogowa -30° +30°
- 917A75
Porcupine Needles
- 90797E
≈ Chocolaty
- 8D7D6E
≈ Restful Brown
Triada +120° +240°
- 917A75
Porcupine Needles
- 738578
≈ Xanadu
- 7A7F92
≈ Your Shadow
Komplementarna rozszczepiona +150° +210°
- 917A75
Porcupine Needles
- 6D8681
≈ Marsh Creek
- 718391
≈ Mica Creek
Tetrada +90° +180° +270°
- 917A75
Porcupine Needles
- 7D8370
≈ Cactus Garden
- 6C858B
≈ Indigo Mouse
- 837C8F
≈ Purpletone
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.00:1 · APCA Lc 67
Ag
AANa czerni
WCAG 5.24:1 · APCA Lc 34
Najlepszy kolor tekstu: #000000
WCAG 5.24:1 (AA) · APCA Lc 34
Contrast pairs
Fragmenty kodu
CSS
:root {
--porcupine-needles: #917a75;
--porcupine-needles-rgb: 145 122 117;
--porcupine-needles-oklch: oklch(0.6 0.03 32.3);
}
.element {
color: var(--porcupine-needles);
background-color: hsl(11 11% 51%);
border-color: oklch(0.6 0.03 32.3);
}Tailwind CSS v4
@theme {
--color-porcupine-needles: #917a75;
--color-porcupine-needles-50: #fdf2f0;
--color-porcupine-needles-100: #f2e5e1;
--color-porcupine-needles-200: #e1d0cc;
--color-porcupine-needles-300: #c6b2ad;
--color-porcupine-needles-400: #af9893;
--color-porcupine-needles-500: #997f7a;
--color-porcupine-needles-600: #816c67;
--color-porcupine-needles-700: #685652;
--color-porcupine-needles-800: #4c3f3c;
--color-porcupine-needles-900: #352b29;
--color-porcupine-needles-950: #201817;
}SCSS
$porcupine-needles: #917a75;
$porcupine-needles-rgb: 145, 122, 117;
$porcupine-needles-light: mix(#fff, $porcupine-needles, 20%);
$porcupine-needles-dark: mix(#000, $porcupine-needles, 20%);
.element {
color: $porcupine-needles;
box-shadow: 0 0 0 2px rgba($porcupine-needles, 0.35);
}