Color con nombre · #FFA74F
Pumpkin Vapour
Pumpkin Vapour es #FFA74F: rgb(255 167 79), hsl(30 100% 65%), oklch(0.8 0.145 62.9). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Pumpkin Vapour color name →
#FFA74F
oklch(0.8 0.145 62.9)
Conversiones de color
- HEX
- #ffa74f
- RGB
- rgb(255 167 79)
- HSL
- hsl(30 100% 65%)
- HWB
- hwb(30 31% 0%)
- OKLCH
- oklch(0.8 0.145 62.9)
- OKLab
- oklab(0.8 0.066 0.129)
- CIE Lab
- lab(76.33 27.95 57.87)
- LCH
- lch(76.33 64.27 64.2)
- CMYK
- cmyk(0% 35% 69% 0%)
Tintes · Sombras · Tonos
Tintes
- FFB065
- FFBA78
- FFC38A
- FFCB9C
- FFD4AD
- FFDDBD
- FFE6CE
- FFEEDE
- FFF7EF
Sombras
- DE9144
- BE7B38
- 9E662E
- 805223
- 633E19
- 482C10
- 2E1A07
- 160A02
- 030100
Tonos
- F2A458
- E5A05F
- D99C65
- CC996A
- BF956F
- B39173
- A68D77
- 99897A
- 8D847D
Armonías de color
Complementario +180°
- FFA74F
Pumpkin Vapour
- 7CC6FF
≈ Chromis Damsel Blue
Análogo -30° +30°
- FFA74F
Pumpkin Vapour
- FFA28D
≈ Tangerine Cream
- DEBB3A
≈ Bollywood
Triádico +120° +240°
- FFA74F
Pumpkin Vapour
- 00DBC6
≈ Mint Morning
- CDAAFF
≈ Purple Hepatica
Complementario dividido +150° +210°
- FFA74F
Pumpkin Vapour
- 00D4F3
≈ Neon Blue
- A8BAFF
≈ Pastel Blue
Tetrádico +90° +180° +270°
- FFA74F
Pumpkin Vapour
- 6AD890
≈ Aurora Green
- 7CC6FF
≈ Chromis Damsel Blue
- F599E6
≈ Diva Mecha
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.92:1 · APCA Lc 37
Ag
AAASobre negro
WCAG 10.89:1 · APCA Lc 66
Mejor color de texto: #000000
WCAG 10.89:1 (AAA) · APCA Lc 66
Contrast pairs
Fragmentos de código
CSS
:root {
--pumpkin-vapour: #ffa74f;
--pumpkin-vapour-rgb: 255 167 79;
--pumpkin-vapour-oklch: oklch(0.8 0.145 62.9);
}
.element {
color: var(--pumpkin-vapour);
background-color: hsl(30 100% 65%);
border-color: oklch(0.8 0.145 62.9);
}Tailwind CSS v4
@theme {
--color-pumpkin-vapour: #ffa74f;
--color-pumpkin-vapour-50: #ffedca;
--color-pumpkin-vapour-100: #ffdfb5;
--color-pumpkin-vapour-200: #ffc892;
--color-pumpkin-vapour-300: #eba763;
--color-pumpkin-vapour-400: #da8934;
--color-pumpkin-vapour-500: #c76b00;
--color-pumpkin-vapour-600: #a85b00;
--color-pumpkin-vapour-700: #874900;
--color-pumpkin-vapour-800: #653400;
--color-pumpkin-vapour-900: #472300;
--color-pumpkin-vapour-950: #2e1200;
}SCSS
$pumpkin-vapour: #ffa74f;
$pumpkin-vapour-rgb: 255, 167, 79;
$pumpkin-vapour-light: mix(#fff, $pumpkin-vapour, 20%);
$pumpkin-vapour-dark: mix(#000, $pumpkin-vapour, 20%);
.element {
color: $pumpkin-vapour;
box-shadow: 0 0 0 2px rgba($pumpkin-vapour, 0.35);
}