Benoemde kleur · #BB2255
Raven’s Banquet
Raven’s Banquet is #BB2255: rgb(187 34 85), hsl(340 69% 43%), oklch(0.523 0.188 7.9). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Red mean? → · Raven’s Banquet color name →
#BB2255
oklch(0.523 0.188 7.9)
Kleurconversies
- HEX
- #bb2255
- RGB
- rgb(187 34 85)
- HSL
- hsl(340 69% 43%)
- HWB
- hwb(340 13% 27%)
- OKLCH
- oklch(0.523 0.188 7.9)
- OKLab
- oklab(0.523 0.186 0.026)
- CIE Lab
- lab(42.39 61.01 11.41)
- LCH
- lch(42.39 62.07 10.6)
- CMYK
- cmyk(0% 82% 55% 27%)
Tinten · Schaduwen · Tonen
Tinten
- C54165
- CE5974
- D76F85
- DE8495
- E698A6
- ECADB7
- F2C1C9
- F7D6DB
- FBEAED
Schaduwen
- A21C49
- 8A163D
- 731131
- 5C0B26
- 46071C
- 320311
- 1F0108
- 0D0002
- 020000
Tonen
- B73359
- B3405D
- AE4A62
- A95466
- A35C6A
- 9E646F
- 976C73
- 907377
- 89797C
Kleurharmonieën
Complementair +180°
- BB2255
Raven’s Banquet
- 007A73
≈ Hydra Turquoise
Analoog -30° +30°
- BB2255
Raven’s Banquet
- A92E8F
≈ Magneto’s Magenta
- B73700
≈ Dropped Brick
Triadisch +120° +240°
- BB2255
Raven’s Banquet
- 537700
≈ Tropicana
- 006DB5
≈ Beautiful Blue
Gesplitst complementair +150° +210°
- BB2255
Raven’s Banquet
- 007E4D
≈ Picture Book Green
- 00768D
≈ Enamel Blue
Tetradisch +90° +180° +270°
- BB2255
Raven’s Banquet
- 7B6900
≈ Arousing Alligator
- 007A73
≈ Hydra Turquoise
- 5555D2
≈ Iris
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 6.04:1 · APCA Lc 79
Ag
FailOp zwart
WCAG 3.47:1 · APCA Lc 23
Beste tekstkleur: #FFFFFF
WCAG 6.04:1 (AA) · APCA Lc 79
Contrast pairs
Codefragmenten
CSS
:root {
--raven-s-banquet: #bb2255;
--raven-s-banquet-rgb: 187 34 85;
--raven-s-banquet-oklch: oklch(0.523 0.188 7.9);
}
.element {
color: var(--raven-s-banquet);
background-color: hsl(340 69% 43%);
border-color: oklch(0.523 0.188 7.9);
}Tailwind CSS v4
@theme {
--color-raven-s-banquet: #bb2255;
--color-raven-s-banquet-50: #ffe0e9;
--color-raven-s-banquet-100: #ffceda;
--color-raven-s-banquet-200: #ffb2c2;
--color-raven-s-banquet-300: #ff8ba2;
--color-raven-s-banquet-400: #f76689;
--color-raven-s-banquet-500: #e53b6e;
--color-raven-s-banquet-600: #c1345e;
--color-raven-s-banquet-700: #9b2a4b;
--color-raven-s-banquet-800: #741c38;
--color-raven-s-banquet-900: #521327;
--color-raven-s-banquet-950: #360415;
}SCSS
$raven-s-banquet: #bb2255;
$raven-s-banquet-rgb: 187, 34, 85;
$raven-s-banquet-light: mix(#fff, $raven-s-banquet, 20%);
$raven-s-banquet-dark: mix(#000, $raven-s-banquet, 20%);
.element {
color: $raven-s-banquet;
box-shadow: 0 0 0 2px rgba($raven-s-banquet, 0.35);
}