Benannte Farbe · #BC64A4
Young Purple
Young Purple ist #BC64A4: rgb(188 100 164), hsl(316 40% 56%), oklch(0.626 0.138 338.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Pink mean? → · Young Purple color name →
#BC64A4
oklch(0.626 0.138 338.4)
Farbumrechnungen
- HEX
- #bc64a4
- RGB
- rgb(188 100 164)
- HSL
- hsl(316 40% 56%)
- HWB
- hwb(316 39% 26%)
- OKLCH
- oklch(0.626 0.138 338.4)
- OKLab
- oklab(0.626 0.128 -0.051)
- CIE Lab
- lab(54.63 42.25 -18.46)
- LCH
- lch(54.63 46.11 336.4)
- CMYK
- cmyk(0% 47% 13% 26%)
Tints · Shades · Tones
Tints
- C474AD
- CB83B6
- D293BF
- DAA2C8
- E0B1D1
- E7C1DA
- EDD0E3
- F3E0ED
- F9EFF6
Shades
- A3568E
- 8B4879
- 733B64
- 5D2E50
- 47223D
- 32162B
- 1F0B1A
- 0D030A
- 020001
Tones
- B768A0
- B16B9D
- AB6E99
- A67196
- A07492
- 9A778F
- 94798B
- 8D7C87
- 877E84
Farbharmonien
Komplementär +180°
- BC64A4
Young Purple
- 1DA068
≈ Biel-Tan Green
Analog -30° +30°
- BC64A4
Young Purple
- 9F6FC7
≈ Lilac Bush
- CB6077
≈ Cherry Fruit
Triadisch +120° +240°
- BC64A4
Young Purple
- 9C8800
≈ Captain Kirk
- 0097B5
≈ Bondi Blue
Geteilt komplementär +150° +210°
- BC64A4
Young Purple
- 6F9731
≈ Hidden Valley
- 009C94
≈ Caribbean Turquoise
Tetradisch +90° +180° +270°
- BC64A4
Young Purple
- BD7500
≈ Caramel Coating
- 1DA068
≈ Biel-Tan Green
- 388DD6
≈ Magical Merlin
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.82:1 · APCA Lc 65
Ag
AAAuf Schwarz
WCAG 5.49:1 · APCA Lc 36
Beste Textfarbe: #000000
WCAG 5.49:1 (AA) · APCA Lc 36
Contrast pairs
Code-Snippets
CSS
:root {
--young-purple: #bc64a4;
--young-purple-rgb: 188 100 164;
--young-purple-oklch: oklch(0.626 0.138 338.4);
}
.element {
color: var(--young-purple);
background-color: hsl(316 40% 56%);
border-color: oklch(0.626 0.138 338.4);
}Tailwind CSS v4
@theme {
--color-young-purple: #bc64a4;
--color-young-purple-50: #ffe6ff;
--color-young-purple-100: #ffd7f6;
--color-young-purple-200: #fdbee6;
--color-young-purple-300: #e79bcd;
--color-young-purple-400: #d27dba;
--color-young-purple-500: #bf5ea5;
--color-young-purple-600: #a1508b;
--color-young-purple-700: #814070;
--color-young-purple-800: #5f2e54;
--color-young-purple-900: #431f3b;
--color-young-purple-950: #2b0e25;
}SCSS
$young-purple: #bc64a4;
$young-purple-rgb: 188, 100, 164;
$young-purple-light: mix(#fff, $young-purple, 20%);
$young-purple-dark: mix(#000, $young-purple, 20%);
.element {
color: $young-purple;
box-shadow: 0 0 0 2px rgba($young-purple, 0.35);
}