Colore con nome · #D46362
Happy Hearts
Happy Hearts è #D46362: rgb(212 99 98), hsl(1 57% 61%), oklch(0.637 0.143 22.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Happy Hearts color name →
#D46362
oklch(0.637 0.143 22.5)
Conversioni di colore
- HEX
- #d46362
- RGB
- rgb(212 99 98)
- HSL
- hsl(1 57% 61%)
- HWB
- hwb(1 38% 17%)
- OKLCH
- oklch(0.637 0.143 22.5)
- OKLab
- oklab(0.637 0.132 0.055)
- CIE Lab
- lab(56.42 45.4 23.16)
- LCH
- lch(56.42 50.96 27)
- CMYK
- cmyk(0% 53% 54% 17%)
Tinte · Ombre · Toni
Tinte
- DA7371
- E08380
- E5938F
- EAA29F
- EFB2AE
- F3C1BE
- F7D1CE
- FAE0DE
- FDEFEF
Ombre
- B85554
- 9D4747
- 833A3A
- 692E2D
- 512121
- 3A1616
- 240B0B
- 100303
- 020000
Toni
- CC6765
- C56B69
- BD6E6C
- B5726F
- AD7572
- A57775
- 9C7A78
- 937C7A
- 8A7E7D
Armonie di colore
Complementare +180°
- D46362
Happy Hearts
- 009EA8
≈ Turkish Boy
Analogo -30° +30°
- D46362
Happy Hearts
- CB6293
≈ Ibis Rose
- CD6E29
≈ Hot Wings
Triadico +120° +240°
- D46362
Happy Hearts
- 51A04C
≈ Fruit Salad
- 5B88E1
≈ Blue Jay
Complementare divisa +150° +210°
- D46362
Happy Hearts
- 00A383
≈ Congo Green
- 0097CD
≈ Tomb Blue
Tetradico +90° +180° +270°
- D46362
Happy Hearts
- 8D9300
≈ Old Asparagus
- 009EA8
≈ Turkish Boy
- 8F78DA
≈ Matt Purple
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.64:1 · APCA Lc 64
Ag
AASu nero
WCAG 5.76:1 · APCA Lc 38
Miglior colore del testo: #000000
WCAG 5.76:1 (AA) · APCA Lc 38
Contrast pairs
Frammenti di codice
CSS
:root {
--happy-hearts: #d46362;
--happy-hearts-rgb: 212 99 98;
--happy-hearts-oklch: oklch(0.637 0.143 22.5);
}
.element {
color: var(--happy-hearts);
background-color: hsl(1 57% 61%);
border-color: oklch(0.637 0.143 22.5);
}Tailwind CSS v4
@theme {
--color-happy-hearts: #d46362;
--color-happy-hearts-50: #ffe6e1;
--color-happy-hearts-100: #ffd6d0;
--color-happy-hearts-200: #ffbdb6;
--color-happy-hearts-300: #f89a93;
--color-happy-hearts-400: #e77977;
--color-happy-hearts-500: #d45859;
--color-happy-hearts-600: #b34b4c;
--color-happy-hearts-700: #903c3c;
--color-happy-hearts-800: #6b2a2d;
--color-happy-hearts-900: #4c1d1e;
--color-happy-hearts-950: #320c0e;
}SCSS
$happy-hearts: #d46362;
$happy-hearts-rgb: 212, 99, 98;
$happy-hearts-light: mix(#fff, $happy-hearts, 20%);
$happy-hearts-dark: mix(#000, $happy-hearts, 20%);
.element {
color: $happy-hearts;
box-shadow: 0 0 0 2px rgba($happy-hearts, 0.35);
}