Colore con nome · #F7C070
Golden Opportunity
Golden Opportunity è #F7C070: rgb(247 192 112), hsl(36 89% 70%), oklch(0.841 0.116 75.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Golden Opportunity color name →
#F7C070
oklch(0.841 0.116 75.4)
Conversioni di colore
- HEX
- #f7c070
- RGB
- rgb(247 192 112)
- HSL
- hsl(36 89% 70%)
- HWB
- hwb(36 44% 3%)
- OKLCH
- oklch(0.841 0.116 75.4)
- OKLab
- oklab(0.841 0.029 0.113)
- CIE Lab
- lab(81.55 13.81 47.82)
- LCH
- lch(81.55 49.78 73.9)
- CMYK
- cmyk(0% 22% 55% 3%)
Tinte · Ombre · Toni
Tinte
- F8C780
- F9CD8F
- FAD39E
- FBDAAC
- FCE0BA
- FDE6C8
- FDEDD6
- FEF3E4
- FFF9F1
Ombre
- D7A760
- B78E51
- 997643
- 7C5F35
- 604927
- 45341A
- 2C200E
- 150E04
- 030201
Toni
- EBBA73
- DEB376
- D2AD79
- C6A77A
- BAA07C
- AF9A7D
- A3937E
- 978D7F
- 8C8680
Armonie di colore
Complementare +180°
- F7C070
Golden Opportunity
- A8CEFF
≈ Night Snow
Analogo -30° +30°
- F7C070
Golden Opportunity
- FFB898
≈ Pallid Orange
- D5CF72
≈ Force of Nature
Triadico +120° +240°
- F7C070
Golden Opportunity
- 5CE2E3
≈ Pluviophile
- E8B4FF
≈ Mauve
Complementare divisa +150° +210°
- F7C070
Golden Opportunity
- 78D9FF
≈ Sky
- C5C4FF
≈ Light Periwinkle
Tetradico +90° +180° +270°
- F7C070
Golden Opportunity
- 7AE3B9
≈ Sprig of Mint
- A8CEFF
≈ Night Snow
- FFAEDB
≈ Fresh Gum
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.64:1 · APCA Lc 29
Ag
AAASu nero
WCAG 12.72:1 · APCA Lc 74
Miglior colore del testo: #000000
WCAG 12.72:1 (AAA) · APCA Lc 74
Contrast pairs
Frammenti di codice
CSS
:root {
--golden-opportunity: #f7c070;
--golden-opportunity-rgb: 247 192 112;
--golden-opportunity-oklch: oklch(0.841 0.116 75.4);
}
.element {
color: var(--golden-opportunity);
background-color: hsl(36 89% 70%);
border-color: oklch(0.841 0.116 75.4);
}Tailwind CSS v4
@theme {
--color-golden-opportunity: #f7c070;
--color-golden-opportunity-50: #fff2d1;
--color-golden-opportunity-100: #fee4bd;
--color-golden-opportunity-200: #f0cf9c;
--color-golden-opportunity-300: #d9b072;
--color-golden-opportunity-400: #c69449;
--color-golden-opportunity-500: #b2790b;
--color-golden-opportunity-600: #966710;
--color-golden-opportunity-700: #79520e;
--color-golden-opportunity-800: #5a3b08;
--color-golden-opportunity-900: #3f2906;
--color-golden-opportunity-950: #281600;
}SCSS
$golden-opportunity: #f7c070;
$golden-opportunity-rgb: 247, 192, 112;
$golden-opportunity-light: mix(#fff, $golden-opportunity, 20%);
$golden-opportunity-dark: mix(#000, $golden-opportunity, 20%);
.element {
color: $golden-opportunity;
box-shadow: 0 0 0 2px rgba($golden-opportunity, 0.35);
}