Colore con nome · #FD5800
Willpower Orange
Willpower Orange è #FD5800: rgb(253 88 0), hsl(21 100% 50%), oklch(0.676 0.213 39.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Willpower Orange color name →
#FD5800
oklch(0.676 0.213 39.7)
Conversioni di colore
- HEX
- #fd5800
- RGB
- rgb(253 88 0)
- HSL
- hsl(21 100% 50%)
- HWB
- hwb(21 0% 1%)
- OKLCH
- oklch(0.676 0.213 39.7)
- OKLab
- oklab(0.676 0.164 0.136)
- CIE Lab
- lab(60.65 61.96 71.38)
- LCH
- lch(60.65 94.52 49)
- CMYK
- cmyk(0% 65% 100% 1%)
Tinte · Ombre · Toni
Tinte
- FF6D35
- FF8051
- FF9169
- FFA280
- FFB295
- FFC2AA
- FFD1C0
- FFE1D5
- FFF0EA
Ombre
- DC4B00
- BC3F00
- 9D3300
- 7F2800
- 621D00
- 471200
- 2D0900
- 160300
- 030000
Toni
- F26025
- E66637
- DA6B44
- CE704F
- C27459
- B67762
- A97A6A
- 9C7C72
- 8E7E79
Armonie di colore
Complementare +180°
- FD5800
Willpower Orange
- 00A8CB
≈ Gummy Dolphins
Analogo -30° +30°
- FD5800
Willpower Orange
- FD4C79
≈ Macaroon Rose
- D08400
≈ Copious Caramel
Triadico +120° +240°
- FD5800
Willpower Orange
- 00B375
≈ Green Teal
- 8486FF
≈ Lavender Blue Shadow
Complementare divisa +150° +210°
- FD5800
Willpower Orange
- 00AEA7
≈ Teal Me No Lies
- 219BFF
≈ Blue Nebula
Tetradico +90° +180° +270°
- FD5800
Willpower Orange
- 71AB00
≈ Green Envy
- 00A8CB
≈ Gummy Dolphins
- BE68F7
≈ Easter Purple
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.19:1 · APCA Lc 58
Ag
AASu nero
WCAG 6.57:1 · APCA Lc 44
Miglior colore del testo: #000000
WCAG 6.57:1 (AA) · APCA Lc 44
Contrast pairs
Frammenti di codice
CSS
:root {
--willpower-orange: #fd5800;
--willpower-orange-rgb: 253 88 0;
--willpower-orange-oklch: oklch(0.676 0.213 39.7);
}
.element {
color: var(--willpower-orange);
background-color: hsl(21 100% 50%);
border-color: oklch(0.676 0.213 39.7);
}Tailwind CSS v4
@theme {
--color-willpower-orange: #fd5800;
--color-willpower-orange-50: #ffe2c6;
--color-willpower-orange-100: #ffd1b0;
--color-willpower-orange-200: #ffb48a;
--color-willpower-orange-300: #ff8d59;
--color-willpower-orange-400: #ff6526;
--color-willpower-orange-500: #f13500;
--color-willpower-orange-600: #cb3000;
--color-willpower-orange-700: #a42600;
--color-willpower-orange-800: #7b1900;
--color-willpower-orange-900: #571000;
--color-willpower-orange-950: #3a0100;
}SCSS
$willpower-orange: #fd5800;
$willpower-orange-rgb: 253, 88, 0;
$willpower-orange-light: mix(#fff, $willpower-orange, 20%);
$willpower-orange-dark: mix(#000, $willpower-orange, 20%);
.element {
color: $willpower-orange;
box-shadow: 0 0 0 2px rgba($willpower-orange, 0.35);
}