Nazwany kolor · #A3898A
Tin Pink
Tin Pink to #A3898A: rgb(163 137 138), hsl(358 12% 59%), oklch(0.654 0.032 15.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Tin Pink color name →
#A3898A
oklch(0.654 0.032 15.4)
Konwersje koloru
- HEX
- #a3898a
- RGB
- rgb(163 137 138)
- HSL
- hsl(358 12% 59%)
- HWB
- hwb(358 54% 36%)
- OKLCH
- oklch(0.654 0.032 15.4)
- OKLab
- oklab(0.654 0.031 0.008)
- CIE Lab
- lab(59.55 10.29 3.33)
- LCH
- lch(59.55 10.81 17.9)
- CMYK
- cmyk(0% 16% 15% 36%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AC9495
- B5A0A0
- BEABAC
- C7B7B7
- D0C2C3
- DACECF
- E3DADB
- ECE6E7
- F6F3F3
Odcienie ciemniejsze
- 8D7677
- 786465
- 635353
- 4F4242
- 3C3132
- 2A2222
- 191414
- 0A0707
- 010101
Tony
- A08889
- 9C8788
- 998687
- 958586
- 928585
- 8E8484
- 8B8383
- 878282
- 848181
Harmonie kolorów
Komplementarna +180°
- A3898A
Tin Pink
- 7B9796
≈ Green Granite
Analogowa -30° +30°
- A3898A
Tin Pink
- A08995
≈ Art Nouveau Violet
- A28B81
≈ Portobello
Triada +120° +240°
- A3898A
Tin Pink
- 889582
≈ Aloe Tip
- 8492A4
≈ Fantasy Grey
Komplementarna rozszczepiona +150° +210°
- A3898A
Tin Pink
- 7F978C
≈ Azores
- 7D959F
≈ Wethers Field
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.22:1 · APCA Lc 60
Ag
AANa czerni
WCAG 6.50:1 · APCA Lc 42
Najlepszy kolor tekstu: #000000
WCAG 6.50:1 (AA) · APCA Lc 42
Contrast pairs
Fragmenty kodu
CSS
:root {
--tin-pink: #a3898a;
--tin-pink-rgb: 163 137 138;
--tin-pink-oklch: oklch(0.654 0.032 15.4);
}
.element {
color: var(--tin-pink);
background-color: hsl(358 12% 59%);
border-color: oklch(0.654 0.032 15.4);
}Tailwind CSS v4
@theme {
--color-tin-pink: #a3898a;
--color-tin-pink-50: #fef2f2;
--color-tin-pink-100: #f2e4e4;
--color-tin-pink-200: #e2cfcf;
--color-tin-pink-300: #c7b1b1;
--color-tin-pink-400: #b09798;
--color-tin-pink-500: #9a7e7f;
--color-tin-pink-600: #826b6c;
--color-tin-pink-700: #685556;
--color-tin-pink-800: #4d3e3f;
--color-tin-pink-900: #352b2b;
--color-tin-pink-950: #201819;
}SCSS
$tin-pink: #a3898a;
$tin-pink-rgb: 163, 137, 138;
$tin-pink-light: mix(#fff, $tin-pink, 20%);
$tin-pink-dark: mix(#000, $tin-pink, 20%);
.element {
color: $tin-pink;
box-shadow: 0 0 0 2px rgba($tin-pink, 0.35);
}