Cor nomeada · #F8A77F
Sunset Peach
Sunset Peach é #F8A77F: rgb(248 167 127), hsl(20 90% 74%), oklch(0.799 0.11 47). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Sunset Peach color name →
#F8A77F
oklch(0.799 0.11 47)
Conversões de cor
- HEX
- #f8a77f
- RGB
- rgb(248 167 127)
- HSL
- hsl(20 90% 74%)
- HWB
- hwb(20 50% 3%)
- OKLCH
- oklch(0.799 0.11 47)
- OKLab
- oklab(0.799 0.075 0.081)
- CIE Lab
- lab(75.99 27.6 33.46)
- LCH
- lch(75.99 43.38 50.5)
- CMYK
- cmyk(0% 33% 49% 3%)
Tons claros · Sombras · Tons
Tons claros
- FAB08C
- FBB999
- FCC2A6
- FDCBB3
- FED3BF
- FEDCCC
- FFE5D9
- FFEEE5
- FFF6F2
Sombras
- D8916E
- B87B5D
- 9A664C
- 7C523C
- 603E2D
- 452C1F
- 2C1A11
- 150A06
- 030101
Tons
- ECA380
- E0A080
- D49C81
- C89881
- BC9481
- B09081
- A48C81
- 988881
- 8C8480
Harmonias de cor
Complementar +180°
- F8A77F
Sunset Peach
- 67CCF4
≈ Skyan
Análoga -30° +30°
- F8A77F
Sunset Peach
- FCA0A4
≈ Simple Pink
- E5B468
≈ English Custard
Tríade +120° +240°
- F8A77F
Sunset Peach
- 6FD4AE
≈ Sea Treasure
- B8B3FF
≈ Winterspring Lilac
Complementar dividida +150° +210°
- F8A77F
Sunset Peach
- 55D3D6
≈ Blue Radiance
- 93C0FF
≈ Truesky Gloxym
Tétrade +90° +180° +270°
- F8A77F
Sunset Peach
- 9CCE87
≈ Botanist
- 67CCF4
≈ Skyan
- DAA7EC
≈ Petal Plush
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.93:1 · APCA Lc 37
Ag
AAASobre preto
WCAG 10.82:1 · APCA Lc 65
Melhor cor de texto: #000000
WCAG 10.82:1 (AAA) · APCA Lc 65
Contrast pairs
Trechos de código
CSS
:root {
--sunset-peach: #f8a77f;
--sunset-peach-rgb: 248 167 127;
--sunset-peach-oklch: oklch(0.799 0.11 47);
}
.element {
color: var(--sunset-peach);
background-color: hsl(20 90% 74%);
border-color: oklch(0.799 0.11 47);
}Tailwind CSS v4
@theme {
--color-sunset-peach: #f8a77f;
--color-sunset-peach-50: #ffedda;
--color-sunset-peach-100: #ffdec8;
--color-sunset-peach-200: #fcc7ab;
--color-sunset-peach-300: #e6a785;
--color-sunset-peach-400: #d48a65;
--color-sunset-peach-500: #c16d41;
--color-sunset-peach-600: #a35d38;
--color-sunset-peach-700: #834a2d;
--color-sunset-peach-800: #613520;
--color-sunset-peach-900: #442415;
--color-sunset-peach-950: #2c1307;
}SCSS
$sunset-peach: #f8a77f;
$sunset-peach-rgb: 248, 167, 127;
$sunset-peach-light: mix(#fff, $sunset-peach, 20%);
$sunset-peach-dark: mix(#000, $sunset-peach, 20%);
.element {
color: $sunset-peach;
box-shadow: 0 0 0 2px rgba($sunset-peach, 0.35);
}