Colore con nome · #E16233
Precious Pumpkin
Precious Pumpkin è #E16233: rgb(225 98 51), hsl(16 74% 54%), oklch(0.648 0.17 39.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Precious Pumpkin color name →
#E16233
oklch(0.648 0.17 39.7)
Conversioni di colore
- HEX
- #e16233
- RGB
- rgb(225 98 51)
- HSL
- hsl(16 74% 54%)
- HWB
- hwb(16 20% 12%)
- OKLCH
- oklch(0.648 0.17 39.7)
- OKLab
- oklab(0.648 0.131 0.109)
- CIE Lab
- lab(57.76 48.68 50.78)
- LCH
- lch(57.76 70.34 46.2)
- CMYK
- cmyk(0% 56% 77% 12%)
Tinte · Ombre · Toni
Tinte
- E6734B
- EB8460
- EF9475
- F3A488
- F6B39C
- F9C2B0
- FBD2C3
- FDE1D7
- FEF0EB
Ombre
- C4542B
- A74723
- 8B3A1C
- 702D14
- 56210D
- 3E1607
- 270B03
- 120301
- 020000
Toni
- D8673E
- CF6B48
- C66F51
- BD7259
- B47560
- AA7867
- A07A6E
- 967D74
- 8B7E7A
Armonie di colore
Complementare +180°
- E16233
Precious Pumpkin
- 009EBF
≈ Delos Blue
Analogo -30° +30°
- E16233
Precious Pumpkin
- E15977
≈ Fever Dream
- C47C00
≈ Bamboo Brown
Triadico +120° +240°
- E16233
Precious Pumpkin
- 00A96E
≈ Banaue Jade
- 7C7EF3
≈ Orchid
Complementare divisa +150° +210°
- E16233
Precious Pumpkin
- 00A49D
≈ Grecian Isle
- 2092F0
≈ Karimun Blue
Tetradico +90° +180° +270°
- E16233
Precious Pumpkin
- 6CA10D
≈ Elven Olympics
- 009EBF
≈ Delos Blue
- AE6CDB
≈ Lavender
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.50:1 · APCA Lc 62
Ag
AASu nero
WCAG 5.99:1 · APCA Lc 40
Miglior colore del testo: #000000
WCAG 5.99:1 (AA) · APCA Lc 40
Contrast pairs
Frammenti di codice
CSS
:root {
--precious-pumpkin: #e16233;
--precious-pumpkin-rgb: 225 98 51;
--precious-pumpkin-oklch: oklch(0.648 0.17 39.7);
}
.element {
color: var(--precious-pumpkin);
background-color: hsl(16 74% 54%);
border-color: oklch(0.648 0.17 39.7);
}Tailwind CSS v4
@theme {
--color-precious-pumpkin: #e16233;
--color-precious-pumpkin-50: #ffe6d0;
--color-precious-pumpkin-100: #ffd6bc;
--color-precious-pumpkin-200: #ffbc9b;
--color-precious-pumpkin-300: #ff9870;
--color-precious-pumpkin-400: #f0764b;
--color-precious-pumpkin-500: #de5215;
--color-precious-pumpkin-600: #bc4616;
--color-precious-pumpkin-700: #973812;
--color-precious-pumpkin-800: #71270e;
--color-precious-pumpkin-900: #501a09;
--color-precious-pumpkin-950: #350900;
}SCSS
$precious-pumpkin: #e16233;
$precious-pumpkin-rgb: 225, 98, 51;
$precious-pumpkin-light: mix(#fff, $precious-pumpkin, 20%);
$precious-pumpkin-dark: mix(#000, $precious-pumpkin, 20%);
.element {
color: $precious-pumpkin;
box-shadow: 0 0 0 2px rgba($precious-pumpkin, 0.35);
}