Benannte Farbe · #BB0088
Vibrant Velvet
Vibrant Velvet ist #BB0088: rgb(187 0 136), hsl(316 100% 37%), oklch(0.528 0.225 345). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Pink mean? → · Vibrant Velvet color name →
#BB0088
oklch(0.528 0.225 345)
Farbumrechnungen
- HEX
- #bb0088
- RGB
- rgb(187 0 136)
- HSL
- hsl(316 100% 37%)
- HWB
- hwb(316 0% 27%)
- OKLCH
- oklch(0.528 0.225 345)
- OKLab
- oklab(0.528 0.217 -0.058)
- CIE Lab
- lab(42.08 69.31 -20.87)
- LCH
- lch(42.08 72.38 343.2)
- CMYK
- cmyk(0% 100% 27% 27%)
Tints · Shades · Tones
Tints
- C53594
- CE519F
- D669AB
- DE7FB7
- E595C3
- ECAACF
- F2BFDB
- F7D5E7
- FBEAF3
Shades
- A20075
- 8A0063
- 730052
- 5C0041
- 460031
- 320022
- 1F0013
- 0D0006
- 020001
Tones
- B72587
- B23687
- AE4486
- A94F85
- A35985
- 9D6284
- 976A83
- 907282
- 887981
Farbharmonien
Komplementär +180°
- BB0088
Vibrant Velvet
- 007F5B
≈ Spanish Viridian
Analog -30° +30°
- BB0088
Vibrant Velvet
- 992BC1
≈ Purple Vanity
- C70042
≈ Akari Red
Triadisch +120° +240°
- BB0088
Vibrant Velvet
- 756E00
≈ Bronze Yellow
- 007796
≈ Pristine Seas
Geteilt komplementär +150° +210°
- BB0088
Vibrant Velvet
- 407D00
≈ Green People
- 007B7B
≈ Buzzards Bay
Tetradisch +90° +180° +270°
- BB0088
Vibrant Velvet
- 906000
≈ Rat Brown
- 007F5B
≈ Spanish Viridian
- 0069CC
≈ Royal Navy Blue
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.05:1 · APCA Lc 78
Ag
FailAuf Schwarz
WCAG 3.46:1 · APCA Lc 24
Beste Textfarbe: #FFFFFF
WCAG 6.05:1 (AA) · APCA Lc 78
Contrast pairs
Code-Snippets
CSS
:root {
--vibrant-velvet: #bb0088;
--vibrant-velvet-rgb: 187 0 136;
--vibrant-velvet-oklch: oklch(0.528 0.225 345);
}
.element {
color: var(--vibrant-velvet);
background-color: hsl(316 100% 37%);
border-color: oklch(0.528 0.225 345);
}Tailwind CSS v4
@theme {
--color-vibrant-velvet: #bb0088;
--color-vibrant-velvet-50: #ffdcff;
--color-vibrant-velvet-100: #ffc9f7;
--color-vibrant-velvet-200: #ffabe7;
--color-vibrant-velvet-300: #ff82cd;
--color-vibrant-velvet-400: #f55abc;
--color-vibrant-velvet-500: #e322a7;
--color-vibrant-velvet-600: #bf228d;
--color-vibrant-velvet-700: #9a1c71;
--color-vibrant-velvet-800: #721256;
--color-vibrant-velvet-900: #500c3c;
--color-vibrant-velvet-950: #350026;
}SCSS
$vibrant-velvet: #bb0088;
$vibrant-velvet-rgb: 187, 0, 136;
$vibrant-velvet-light: mix(#fff, $vibrant-velvet, 20%);
$vibrant-velvet-dark: mix(#000, $vibrant-velvet, 20%);
.element {
color: $vibrant-velvet;
box-shadow: 0 0 0 2px rgba($vibrant-velvet, 0.35);
}