Colore con nome · #F5D8BA
Porcelain Peach
Porcelain Peach è #F5D8BA: rgb(245 216 186), hsl(31 75% 85%), oklch(0.899 0.051 68.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Porcelain Peach color name →
#F5D8BA
oklch(0.899 0.051 68.1)
Conversioni di colore
- HEX
- #f5d8ba
- RGB
- rgb(245 216 186)
- HSL
- hsl(31 75% 85%)
- HWB
- hwb(31 73% 4%)
- OKLCH
- oklch(0.899 0.051 68.1)
- OKLab
- oklab(0.899 0.019 0.048)
- CIE Lab
- lab(88.22 7.08 18.74)
- LCH
- lch(88.22 20.03 69.3)
- CMYK
- cmyk(0% 12% 24% 4%)
Tinte · Ombre · Toni
Tinte
- F6DCC1
- F7E0C8
- F8E4CF
- F9E8D6
- FAECDD
- FBEFE3
- FCF3EA
- FDF7F1
- FEFBF8
Ombre
- D5BCA1
- B6A089
- 988572
- 7B6B5C
- 5F5346
- 443B32
- 2B251E
- 15110D
- 030202
Toni
- E9CFB4
- DDC6AE
- D1BDA8
- C5B4A3
- B9AB9D
- ADA297
- A29A91
- 96918C
- 8B8886
Armonie di colore
Complementare +180°
- F5D8BA
Porcelain Peach
- C4E1FF
≈ Dithered Sky
Analogo -30° +30°
- F5D8BA
Porcelain Peach
- FDD3C5
≈ Coral Dune
- E6DFB8
≈ Swan Dance
Triadico +120° +240°
- F5D8BA
Porcelain Peach
- B8E9E4
≈ Tahitian Breeze
- E7D5F8
≈ Lavender Princess
Complementare divisa +150° +210°
- F5D8BA
Porcelain Peach
- B8E7F4
≈ First of July
- D5DBFF
≈ Icy Plains
Tetradico +90° +180° +270°
- F5D8BA
Porcelain Peach
- C2E9D1
≈ Martian Moon
- C4E1FF
≈ Dithered Sky
- F5D1EA
≈ Little Smile
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.36:1 · APCA Lc 18
Ag
AAASu nero
WCAG 15.41:1 · APCA Lc 86
Miglior colore del testo: #000000
WCAG 15.41:1 (AAA) · APCA Lc 86
Contrast pairs
Frammenti di codice
CSS
:root {
--porcelain-peach: #f5d8ba;
--porcelain-peach-rgb: 245 216 186;
--porcelain-peach-oklch: oklch(0.899 0.051 68.1);
}
.element {
color: var(--porcelain-peach);
background-color: hsl(31 75% 85%);
border-color: oklch(0.899 0.051 68.1);
}Tailwind CSS v4
@theme {
--color-porcelain-peach: #f5d8ba;
--color-porcelain-peach-50: #fff3e6;
--color-porcelain-peach-100: #f3e5d6;
--color-porcelain-peach-200: #e3d1bd;
--color-porcelain-peach-300: #c9b39c;
--color-porcelain-peach-400: #b3997e;
--color-porcelain-peach-500: #9d8061;
--color-porcelain-peach-600: #856d53;
--color-porcelain-peach-700: #6a5742;
--color-porcelain-peach-800: #4f3f2f;
--color-porcelain-peach-900: #372b20;
--color-porcelain-peach-950: #221910;
}SCSS
$porcelain-peach: #f5d8ba;
$porcelain-peach-rgb: 245, 216, 186;
$porcelain-peach-light: mix(#fff, $porcelain-peach, 20%);
$porcelain-peach-dark: mix(#000, $porcelain-peach, 20%);
.element {
color: $porcelain-peach;
box-shadow: 0 0 0 2px rgba($porcelain-peach, 0.35);
}