Benannte Farbe · #A33737
Hibiscus Red
Hibiscus Red ist #A33737: rgb(163 55 55), hsl(0 50% 43%), oklch(0.493 0.143 24). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Hibiscus Red color name →
#A33737
oklch(0.493 0.143 24)
Farbumrechnungen
- HEX
- #a33737
- RGB
- rgb(163 55 55)
- HSL
- hsl(0 50% 43%)
- HWB
- hwb(0 22% 36%)
- OKLCH
- oklch(0.493 0.143 24)
- OKLab
- oklab(0.493 0.131 0.058)
- CIE Lab
- lab(39.78 45.26 25.71)
- LCH
- lch(39.78 52.05 29.6)
- CMYK
- cmyk(0% 66% 66% 36%)
Tints · Shades · Tones
Tints
- AE4D4A
- B9615D
- C37570
- CD8883
- D79C97
- E0AFAB
- E8C3C0
- F0D7D4
- F8EBEA
Shades
- 8D2E2E
- 782626
- 631E1E
- 4F1616
- 3C0F0F
- 2A0808
- 190303
- 0A0101
- 010000
Tones
- A1413F
- 9F4946
- 9C514E
- 995955
- 96605C
- 936763
- 8F6D6A
- 8A7472
- 857A79
Farbharmonien
Komplementär +180°
- A33737
Hibiscus Red
- 006F77
≈ Carnival Night
Analog -30° +30°
- A33737
Hibiscus Red
- 9B3767
≈ Scarlet Flame
- 954A00
≈ Brownie
Triadisch +120° +240°
- A33737
Hibiscus Red
- 1C7523
≈ Green Glutton
- 365CB2
≈ Blasphemous Blue
Geteilt komplementär +150° +210°
- A33737
Hibiscus Red
- 00725D
≈ Tropical Rainforest
- 006A93
≈ Port au Prince
Tetradisch +90° +180° +270°
- A33737
Hibiscus Red
- 616800
≈ Mud Green
- 006F77
≈ Carnival Night
- 684CA9
≈ Ultrapurple Merge
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.64:1 · APCA Lc 82
Ag
FailAuf Schwarz
WCAG 3.15:1 · APCA Lc 20
Beste Textfarbe: #FFFFFF
WCAG 6.64:1 (AA) · APCA Lc 82
Contrast pairs
Code-Snippets
CSS
:root {
--hibiscus-red: #a33737;
--hibiscus-red-rgb: 163 55 55;
--hibiscus-red-oklch: oklch(0.493 0.143 24);
}
.element {
color: var(--hibiscus-red);
background-color: hsl(0 50% 43%);
border-color: oklch(0.493 0.143 24);
}Tailwind CSS v4
@theme {
--color-hibiscus-red: #a33737;
--color-hibiscus-red-50: #ffe6e0;
--color-hibiscus-red-100: #ffd6cf;
--color-hibiscus-red-200: #ffbdb4;
--color-hibiscus-red-300: #f89a91;
--color-hibiscus-red-400: #e77a74;
--color-hibiscus-red-500: #d45856;
--color-hibiscus-red-600: #b34c49;
--color-hibiscus-red-700: #903c3a;
--color-hibiscus-red-800: #6b2b2b;
--color-hibiscus-red-900: #4c1d1d;
--color-hibiscus-red-950: #320c0d;
}SCSS
$hibiscus-red: #a33737;
$hibiscus-red-rgb: 163, 55, 55;
$hibiscus-red-light: mix(#fff, $hibiscus-red, 20%);
$hibiscus-red-dark: mix(#000, $hibiscus-red, 20%);
.element {
color: $hibiscus-red;
box-shadow: 0 0 0 2px rgba($hibiscus-red, 0.35);
}