Colore con nome · #CA955C
Burnt Pumpkin
Burnt Pumpkin è #CA955C: rgb(202 149 92), hsl(31 51% 58%), oklch(0.709 0.098 67.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Burnt Pumpkin color name →
#CA955C
oklch(0.709 0.098 67.2)
Conversioni di colore
- HEX
- #ca955c
- RGB
- rgb(202 149 92)
- HSL
- hsl(31 51% 58%)
- HWB
- hwb(31 36% 21%)
- OKLCH
- oklch(0.709 0.098 67.2)
- OKLab
- oklab(0.709 0.038 0.09)
- CIE Lab
- lab(66.01 15.84 38.05)
- LCH
- lch(66.01 41.22 67.4)
- CMYK
- cmyk(0% 26% 54% 21%)
Tinte · Ombre · Toni
Tinte
- D0A06D
- D5AA7D
- DBB58E
- E0BF9E
- E5CAAE
- EBD4BE
- F0DFCE
- F5EADE
- FAF4EF
Ombre
- AF814F
- 956D42
- 7C5A36
- 64482A
- 4D371F
- 372614
- 22160A
- 0F0803
- 020100
Toni
- C39361
- BB9165
- B48F69
- AD8D6D
- A58B71
- 9E8974
- 968777
- 8F857A
- 87827D
Armonie di colore
Complementare +180°
- CA955C
Burnt Pumpkin
- 6DA7DB
≈ Acapulco Dive
Analogo -30° +30°
- CA955C
Burnt Pumpkin
- D68B75
≈ Vintage Coral
- B2A157
≈ Gingko Leaf
Triadico +120° +240°
- CA955C
Burnt Pumpkin
- 4BB5AB
≈ Emerald Wave
- B191D1
≈ Pale Purple
Complementare divisa +150° +210°
- CA955C
Burnt Pumpkin
- 4EB0C9
≈ Viking
- 929BDE
≈ Portage
Tetradico +90° +180° +270°
- CA955C
Burnt Pumpkin
- 6AB489
≈ Crazy Eyes
- 6DA7DB
≈ Acapulco Dive
- C989B7
≈ Rock Star Pink
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.63:1 · APCA Lc 51
Ag
AAASu nero
WCAG 7.96:1 · APCA Lc 51
Miglior colore del testo: #000000
WCAG 7.96:1 (AAA) · APCA Lc 51
Contrast pairs
Frammenti di codice
CSS
:root {
--burnt-pumpkin: #ca955c;
--burnt-pumpkin-rgb: 202 149 92;
--burnt-pumpkin-oklch: oklch(0.709 0.098 67.2);
}
.element {
color: var(--burnt-pumpkin);
background-color: hsl(31 51% 58%);
border-color: oklch(0.709 0.098 67.2);
}Tailwind CSS v4
@theme {
--color-burnt-pumpkin: #ca955c;
--color-burnt-pumpkin-50: #fff1d8;
--color-burnt-pumpkin-100: #fee3c6;
--color-burnt-pumpkin-200: #f0cda8;
--color-burnt-pumpkin-300: #d8af81;
--color-burnt-pumpkin-400: #c5935e;
--color-burnt-pumpkin-500: #b17837;
--color-burnt-pumpkin-600: #966630;
--color-burnt-pumpkin-700: #785226;
--color-burnt-pumpkin-800: #593b1b;
--color-burnt-pumpkin-900: #3f2811;
--color-burnt-pumpkin-950: #281604;
}SCSS
$burnt-pumpkin: #ca955c;
$burnt-pumpkin-rgb: 202, 149, 92;
$burnt-pumpkin-light: mix(#fff, $burnt-pumpkin, 20%);
$burnt-pumpkin-dark: mix(#000, $burnt-pumpkin, 20%);
.element {
color: $burnt-pumpkin;
box-shadow: 0 0 0 2px rgba($burnt-pumpkin, 0.35);
}