Color con nombre · #98333A
Queen of Hearts
Queen of Hearts es #98333A: rgb(152 51 58), hsl(356 50% 40%), oklch(0.47 0.135 20). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Red mean? → · Queen of Hearts color name →
#98333A
oklch(0.47 0.135 20)
Conversiones de color
- HEX
- #98333a
- RGB
- rgb(152 51 58)
- HSL
- hsl(356 50% 40%)
- HWB
- hwb(356 20% 40%)
- OKLCH
- oklch(0.47 0.135 20)
- OKLab
- oklab(0.47 0.127 0.046)
- CIE Lab
- lab(37.14 43.21 20.06)
- LCH
- lch(37.14 47.64 24.9)
- CMYK
- cmyk(0% 66% 62% 40%)
Tintes · Sombras · Tonos
Tintes
- A4494C
- B05D5E
- BB7171
- C68584
- D19998
- DBADAC
- E4C1C0
- EED5D5
- F7EAEA
Sombras
- 842B31
- 702328
- 5C1C20
- 4A1418
- 380D10
- 270709
- 170304
- 080101
- 010000
Tonos
- 973D41
- 964648
- 944E4F
- 935656
- 905D5D
- 8E6564
- 8B6C6B
- 887372
- 847979
Armonías de color
Complementario +180°
- 98333A
Queen of Hearts
- 00686D
≈ Tahitian Treat
Análogo -30° +30°
- 98333A
Queen of Hearts
- 8F3465
≈ Beetiful Magenta
- 904100
≈ Korichnewyi Brown
Triádico +120° +240°
- 98333A
Queen of Hearts
- 296C17
≈ Brazilian Green
- 2958A5
≈ Miracle at Wrigley
Complementario dividido +150° +210°
- 98333A
Queen of Hearts
- 006B53
≈ Poster Green
- 006485
≈ Bowerbird Blue
Tetrádico +90° +180° +270°
- 98333A
Queen of Hearts
- 5F5F00
≈ Kirchner Green
- 00686D
≈ Tahitian Treat
- 5C49A0
≈ Ultrapurple Merge
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 7.31:1 · APCA Lc 85
Ag
FailSobre negro
WCAG 2.86:1 · APCA Lc 17
Mejor color de texto: #FFFFFF
WCAG 7.31:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmentos de código
CSS
:root {
--queen-of-hearts: #98333a;
--queen-of-hearts-rgb: 152 51 58;
--queen-of-hearts-oklch: oklch(0.47 0.135 20);
}
.element {
color: var(--queen-of-hearts);
background-color: hsl(356 50% 40%);
border-color: oklch(0.47 0.135 20);
}Tailwind CSS v4
@theme {
--color-queen-of-hearts: #98333a;
--color-queen-of-hearts-50: #ffe7e4;
--color-queen-of-hearts-100: #ffd7d4;
--color-queen-of-hearts-200: #ffbeba;
--color-queen-of-hearts-300: #f59b98;
--color-queen-of-hearts-400: #e37c7d;
--color-queen-of-hearts-500: #d05b60;
--color-queen-of-hearts-600: #b04e52;
--color-queen-of-hearts-700: #8d3e41;
--color-queen-of-hearts-800: #692c30;
--color-queen-of-hearts-900: #4a1e21;
--color-queen-of-hearts-950: #300d10;
}SCSS
$queen-of-hearts: #98333a;
$queen-of-hearts-rgb: 152, 51, 58;
$queen-of-hearts-light: mix(#fff, $queen-of-hearts, 20%);
$queen-of-hearts-dark: mix(#000, $queen-of-hearts, 20%);
.element {
color: $queen-of-hearts;
box-shadow: 0 0 0 2px rgba($queen-of-hearts, 0.35);
}