Nazwany kolor · #CE862F
Pumpkin Squash
Pumpkin Squash to #CE862F: rgb(206 134 47), hsl(33 63% 50%), oklch(0.68 0.132 66.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Pumpkin Squash color name →
#CE862F
oklch(0.68 0.132 66.6)
Konwersje koloru
- HEX
- #ce862f
- RGB
- rgb(206 134 47)
- HSL
- hsl(33 63% 50%)
- HWB
- hwb(33 18% 19%)
- OKLCH
- oklch(0.68 0.132 66.6)
- OKLab
- oklab(0.68 0.052 0.121)
- CIE Lab
- lab(62.5 23.32 55.74)
- LCH
- lch(62.5 60.42 67.3)
- CMYK
- cmyk(0% 35% 77% 19%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D4924A
- D99E60
- DEAB75
- E4B789
- E8C39D
- EDCFB1
- F2DBC4
- F6E7D8
- FBF3EB
Odcienie ciemniejsze
- B37427
- 986220
- 7F5119
- 664012
- 4E300C
- 382106
- 231303
- 0F0601
- 020100
Tony
- C6863D
- BF8648
- B78551
- AF8559
- A88561
- A08468
- 98836E
- 908275
- 88817A
Harmonie kolorów
Komplementarna +180°
- CE862F
Pumpkin Squash
- 4B9EE5
≈ Perfect Days
Analogowa -30° +30°
- CE862F
Pumpkin Squash
- DD785C
≈ Potash
- B0971E
≈ High Strung
Triada +120° +240°
- CE862F
Pumpkin Squash
- 00AFA4
≈ Cozumel
- AD81D8
≈ Lavender Blossom
Komplementarna rozszczepiona +150° +210°
- CE862F
Pumpkin Squash
- 00AAC8
≈ Gummy Dolphins
- 848FE9
≈ Perrywinkle
Tetrada +90° +180° +270°
- CE862F
Pumpkin Squash
- 44B076
≈ Link’s Awakening
- 4B9EE5
≈ Perfect Days
- CB77B6
≈ Sky Magenta
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.96:1 · APCA Lc 56
Ag
AAANa czerni
WCAG 7.07:1 · APCA Lc 46
Najlepszy kolor tekstu: #000000
WCAG 7.07:1 (AAA) · APCA Lc 46
Contrast pairs
Fragmenty kodu
CSS
:root {
--pumpkin-squash: #ce862f;
--pumpkin-squash-rgb: 206 134 47;
--pumpkin-squash-oklch: oklch(0.68 0.132 66.6);
}
.element {
color: var(--pumpkin-squash);
background-color: hsl(33 63% 50%);
border-color: oklch(0.68 0.132 66.6);
}Tailwind CSS v4
@theme {
--color-pumpkin-squash: #ce862f;
--color-pumpkin-squash-50: #ffefcd;
--color-pumpkin-squash-100: #ffe1b9;
--color-pumpkin-squash-200: #faca97;
--color-pumpkin-squash-300: #e4ab6a;
--color-pumpkin-squash-400: #d28d3f;
--color-pumpkin-squash-500: #bf7100;
--color-pumpkin-squash-600: #a16000;
--color-pumpkin-squash-700: #824d00;
--color-pumpkin-squash-800: #613700;
--color-pumpkin-squash-900: #442601;
--color-pumpkin-squash-950: #2c1400;
}SCSS
$pumpkin-squash: #ce862f;
$pumpkin-squash-rgb: 206, 134, 47;
$pumpkin-squash-light: mix(#fff, $pumpkin-squash, 20%);
$pumpkin-squash-dark: mix(#000, $pumpkin-squash, 20%);
.element {
color: $pumpkin-squash;
box-shadow: 0 0 0 2px rgba($pumpkin-squash, 0.35);
}