Benannte Farbe · #B48286
Retro Pink
Retro Pink ist #B48286: rgb(180 130 134), hsl(355 25% 61%), oklch(0.657 0.062 13.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Retro Pink color name →
#B48286
oklch(0.657 0.062 13.6)
Farbumrechnungen
- HEX
- #b48286
- RGB
- rgb(180 130 134)
- HSL
- hsl(355 25% 61%)
- HWB
- hwb(355 51% 29%)
- OKLCH
- oklch(0.657 0.062 13.6)
- OKLab
- oklab(0.657 0.06 0.015)
- CIE Lab
- lab(59.53 20.29 5.88)
- LCH
- lch(59.53 21.13 16.2)
- CMYK
- cmyk(0% 28% 26% 29%)
Tints · Shades · Tones
Tints
- BC8E91
- C49A9D
- CBA6A9
- D3B3B5
- DABFC1
- E2CCCD
- E9D8D9
- F0E5E6
- F8F2F2
Shades
- 9C7074
- 855F62
- 6E4E51
- 583E40
- 442F30
- 302021
- 1D1213
- 0C0606
- 020101
Tones
- AF8285
- AA8285
- A58284
- A08284
- 9B8183
- 958182
- 908182
- 8B8181
- 858081
Farbharmonien
Komplementär +180°
- B48286
Retro Pink
- 629E9C
≈ Cadet Blue
Analog -30° +30°
- B48286
Retro Pink
- AD829B
≈ Capri Fashion Pink
- B28573
≈ Light Mocha
Triadisch +120° +240°
- B48286
Retro Pink
- 829A73
≈ Wild Thyme
- 7794B7
≈ Jay Wing Feathers
Geteilt komplementär +150° +210°
- B48286
Retro Pink
- 6E9E87
≈ Peahen
- 669AAD
≈ Cloudy Sea
Tetradisch +90° +180° +270°
- B48286
Retro Pink
- 989367
≈ Cactus Sand
- 629E9C
≈ Cadet Blue
- 8C8DB7
≈ Sweet Lavender
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.24:1 · APCA Lc 60
Ag
AAAuf Schwarz
WCAG 6.47:1 · APCA Lc 42
Beste Textfarbe: #000000
WCAG 6.47:1 (AA) · APCA Lc 42
Contrast pairs
Code-Snippets
CSS
:root {
--retro-pink: #b48286;
--retro-pink-rgb: 180 130 134;
--retro-pink-oklch: oklch(0.657 0.062 13.6);
}
.element {
color: var(--retro-pink);
background-color: hsl(355 25% 61%);
border-color: oklch(0.657 0.062 13.6);
}Tailwind CSS v4
@theme {
--color-retro-pink: #b48286;
--color-retro-pink-50: #ffeeef;
--color-retro-pink-100: #fce0e1;
--color-retro-pink-200: #eecacb;
--color-retro-pink-300: #d5abad;
--color-retro-pink-400: #c09094;
--color-retro-pink-500: #ab757a;
--color-retro-pink-600: #916367;
--color-retro-pink-700: #744f52;
--color-retro-pink-800: #563a3d;
--color-retro-pink-900: #3c272a;
--color-retro-pink-950: #251517;
}SCSS
$retro-pink: #b48286;
$retro-pink-rgb: 180, 130, 134;
$retro-pink-light: mix(#fff, $retro-pink, 20%);
$retro-pink-dark: mix(#000, $retro-pink, 20%);
.element {
color: $retro-pink;
box-shadow: 0 0 0 2px rgba($retro-pink, 0.35);
}