Colore con nome · #E33928
Wistful Longing
Wistful Longing è #E33928: rgb(227 57 40), hsl(5 77% 52%), oklch(0.604 0.209 30). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Wistful Longing color name →
#E33928
oklch(0.604 0.209 30)
Conversioni di colore
- HEX
- #e33928
- RGB
- rgb(227 57 40)
- HSL
- hsl(5 77% 52%)
- HWB
- hwb(5 16% 11%)
- OKLCH
- oklch(0.604 0.209 30)
- OKLab
- oklab(0.604 0.181 0.104)
- CIE Lab
- lab(52.01 64.79 51.13)
- LCH
- lch(52.01 82.54 38.3)
- CMYK
- cmyk(0% 75% 82% 11%)
Tinte · Ombre · Toni
Tinte
- E95442
- EE6A58
- F37F6D
- F79282
- FAA596
- FDB7AB
- FFC9C0
- FFDBD5
- FFEDEA
Ombre
- C53021
- A8281B
- 8C1F15
- 71170F
- 571009
- 3F0904
- 270402
- 120101
- 030000
Toni
- DB4635
- D25040
- C9594A
- C06152
- B7675B
- AD6D63
- A3736A
- 987872
- 8C7C79
Armonie di colore
Complementare +180°
- E33928
Wistful Longing
- 0092A4
≈ Oasis
Analogo -30° +30°
- E33928
Wistful Longing
- DC347C
≈ Mystic Magenta
- BD6900
≈ Brown Orange
Triadico +120° +240°
- E33928
Wistful Longing
- 009B46
≈ Boogie Blast
- 5371FC
≈ Blue Heath Butterfly
Complementare divisa +150° +210°
- E33928
Wistful Longing
- 009684
≈ Approval Green
- 008ACB
≈ Way Beyond the Blue
Tetradico +90° +180° +270°
- E33928
Wistful Longing
- 778D00
≈ Canopy
- 0092A4
≈ Oasis
- 9759E9
≈ Lavender Indigo
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.30:1 · APCA Lc 68
Ag
AASu nero
WCAG 4.88:1 · APCA Lc 33
Miglior colore del testo: #000000
WCAG 4.88:1 (AA) · APCA Lc 33
Contrast pairs
Frammenti di codice
CSS
:root {
--wistful-longing: #e33928;
--wistful-longing-rgb: 227 57 40;
--wistful-longing-oklch: oklch(0.604 0.209 30);
}
.element {
color: var(--wistful-longing);
background-color: hsl(5 77% 52%);
border-color: oklch(0.604 0.209 30);
}Tailwind CSS v4
@theme {
--color-wistful-longing: #e33928;
--color-wistful-longing-50: #ffe0d0;
--color-wistful-longing-100: #ffcebc;
--color-wistful-longing-200: #ffb29b;
--color-wistful-longing-300: #ff8a71;
--color-wistful-longing-400: #ff624e;
--color-wistful-longing-500: #f12f1d;
--color-wistful-longing-600: #cc2b1c;
--color-wistful-longing-700: #a42316;
--color-wistful-longing-800: #7b1613;
--color-wistful-longing-900: #570f0c;
--color-wistful-longing-950: #3a0101;
}SCSS
$wistful-longing: #e33928;
$wistful-longing-rgb: 227, 57, 40;
$wistful-longing-light: mix(#fff, $wistful-longing, 20%);
$wistful-longing-dark: mix(#000, $wistful-longing, 20%);
.element {
color: $wistful-longing;
box-shadow: 0 0 0 2px rgba($wistful-longing, 0.35);
}