Color con nombre · #A82E33
Heartthrob
Heartthrob es #A82E33: rgb(168 46 51), hsl(358 57% 42%), oklch(0.491 0.158 23.1). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Red mean? → · Heartthrob color name →
#A82E33
oklch(0.491 0.158 23.1)
Conversiones de color
- HEX
- #a82e33
- RGB
- rgb(168 46 51)
- HSL
- hsl(358 57% 42%)
- HWB
- hwb(358 18% 34%)
- OKLCH
- oklch(0.491 0.158 23.1)
- OKLab
- oklab(0.491 0.145 0.062)
- CIE Lab
- lab(39.36 50.26 27.94)
- LCH
- lch(39.36 57.51 29.1)
- CMYK
- cmyk(0% 73% 70% 34%)
Tintes · Sombras · Tonos
Tintes
- B34646
- BE5C5A
- C8716D
- D18581
- DA9995
- E3ADAA
- EBC1BE
- F2D6D4
- F9EAE9
Sombras
- 92272B
- 7C1F23
- 67181C
- 521214
- 3F0B0D
- 2C0607
- 1A0203
- 0A0101
- 010000
Tonos
- A63A3B
- A34443
- A04D4B
- 9D5653
- 995D5A
- 956562
- 916C69
- 8C7371
- 867978
Armonías de color
Complementario +180°
- A82E33
Heartthrob
- 006E76
≈ Teal Motif
Análogo -30° +30°
- A82E33
Heartthrob
- 9F2F68
≈ Amaranth Deep Purple
- 954800
≈ Brownie
Triádico +120° +240°
- A82E33
Heartthrob
- 0D7612
≈ Spreadsheet Green
- 2E5AB9
≈ Amnesia Blue
Complementario dividido +150° +210°
- A82E33
Heartthrob
- 00725C
≈ Tropical Rainforest
- 006991
≈ Port au Prince
Tetrádico +90° +180° +270°
- A82E33
Heartthrob
- 626700
≈ Mud Green
- 006E76
≈ Teal Motif
- 6749B0
≈ Ultrapurple Merge
Contraste y accesibilidad
Ag
AASobre blanco
WCAG 6.76:1 · APCA Lc 82
Ag
FailSobre negro
WCAG 3.10:1 · APCA Lc 20
Mejor color de texto: #FFFFFF
WCAG 6.76:1 (AA) · APCA Lc 82
Contrast pairs
Fragmentos de código
CSS
:root {
--heartthrob: #a82e33;
--heartthrob-rgb: 168 46 51;
--heartthrob-oklch: oklch(0.491 0.158 23.1);
}
.element {
color: var(--heartthrob);
background-color: hsl(358 57% 42%);
border-color: oklch(0.491 0.158 23.1);
}Tailwind CSS v4
@theme {
--color-heartthrob: #a82e33;
--color-heartthrob-50: #ffe4de;
--color-heartthrob-100: #ffd4cd;
--color-heartthrob-200: #ffbab2;
--color-heartthrob-300: #fe968e;
--color-heartthrob-400: #ed7471;
--color-heartthrob-500: #db5152;
--color-heartthrob-600: #b94546;
--color-heartthrob-700: #953738;
--color-heartthrob-800: #6f2729;
--color-heartthrob-900: #4e1a1c;
--color-heartthrob-950: #34090c;
}SCSS
$heartthrob: #a82e33;
$heartthrob-rgb: 168, 46, 51;
$heartthrob-light: mix(#fff, $heartthrob, 20%);
$heartthrob-dark: mix(#000, $heartthrob, 20%);
.element {
color: $heartthrob;
box-shadow: 0 0 0 2px rgba($heartthrob, 0.35);
}