Benoemde kleur · #9A7276
March Pink
March Pink is #9A7276: rgb(154 114 118), hsl(354 17% 53%), oklch(0.593 0.051 12.1). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Red mean? → · March Pink color name →
#9A7276
oklch(0.593 0.051 12.1)
Kleurconversies
- HEX
- #9a7276
- RGB
- rgb(154 114 118)
- HSL
- hsl(354 17% 53%)
- HWB
- hwb(354 45% 40%)
- OKLCH
- oklch(0.593 0.051 12.1)
- OKLab
- oklab(0.593 0.05 0.011)
- CIE Lab
- lab(52.23 16.72 4.29)
- LCH
- lch(52.23 17.26 14.4)
- CMYK
- cmyk(0% 26% 23% 40%)
Tinten · Schaduwen · Tonen
Tinten
- A47F83
- AE8D90
- B89A9D
- C2A8AA
- CCB6B8
- D7C5C6
- E1D3D4
- EBE1E2
- F5F0F0
Schaduwen
- 856266
- 715356
- 5E4447
- 4B3638
- 392829
- 271B1C
- 170E0F
- 090405
- 010101
Tonen
- 987477
- 957578
- 937679
- 90787A
- 8E797B
- 8B7B7C
- 887C7D
- 867D7E
- 837F7F
Kleurharmonieën
Complementair +180°
- 9A7276
March Pink
- 5A8886
≈ Cretan Green
Analoog -30° +30°
- 9A7276
March Pink
- 947287
≈ Very Grape
- 997567
≈ Temptation
Triadisch +120° +240°
- 9A7276
March Pink
- 738566
≈ Wreath
- 68819C
≈ Bay View
Gesplitst complementair +150° +210°
- 9A7276
March Pink
- 638875
≈ Green Adirondack
- 5C8594
≈ Blue Moon Bay
Tetradisch +90° +180° +270°
- 9A7276
March Pink
- 84805C
≈ Wild Ginseng
- 5A8886
≈ Cretan Green
- 797B9C
≈ Bossa Nova Blue
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 4.16:1 · APCA Lc 69
Ag
AAOp zwart
WCAG 5.04:1 · APCA Lc 33
Beste tekstkleur: #000000
WCAG 5.04:1 (AA) · APCA Lc 33
Contrast pairs
Codefragmenten
CSS
:root {
--march-pink: #9a7276;
--march-pink-rgb: 154 114 118;
--march-pink-oklch: oklch(0.593 0.051 12.1);
}
.element {
color: var(--march-pink);
background-color: hsl(354 17% 53%);
border-color: oklch(0.593 0.051 12.1);
}Tailwind CSS v4
@theme {
--color-march-pink: #9a7276;
--color-march-pink-50: #fff0f1;
--color-march-pink-100: #f8e1e3;
--color-march-pink-200: #e9ccce;
--color-march-pink-300: #d0adaf;
--color-march-pink-400: #ba9396;
--color-march-pink-500: #a5797d;
--color-march-pink-600: #8b666a;
--color-march-pink-700: #705255;
--color-march-pink-800: #523b3e;
--color-march-pink-900: #39292b;
--color-march-pink-950: #241618;
}SCSS
$march-pink: #9a7276;
$march-pink-rgb: 154, 114, 118;
$march-pink-light: mix(#fff, $march-pink, 20%);
$march-pink-dark: mix(#000, $march-pink, 20%);
.element {
color: $march-pink;
box-shadow: 0 0 0 2px rgba($march-pink, 0.35);
}