Nazwany kolor · #FDCFB0
Vintage Peach
Vintage Peach to #FDCFB0: rgb(253 207 176), hsl(24 95% 84%), oklch(0.887 0.067 55.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Vintage Peach color name →
#FDCFB0
oklch(0.887 0.067 55.7)
Konwersje koloru
- HEX
- #fdcfb0
- RGB
- rgb(253 207 176)
- HSL
- hsl(24 95% 84%)
- HWB
- hwb(24 69% 1%)
- OKLCH
- oklch(0.887 0.067 55.7)
- OKLab
- oklab(0.887 0.038 0.055)
- CIE Lab
- lab(86.61 13.56 21.89)
- LCH
- lch(86.61 25.75 58.2)
- CMYK
- cmyk(0% 18% 30% 1%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FDD4B8
- FED9C0
- FEDEC8
- FFE2D0
- FFE7D8
- FFECDF
- FFF1E7
- FFF5EF
- FFFAF7
Odcienie ciemniejsze
- DCB499
- BC9982
- 9D7F6C
- 7F6756
- 624F42
- 47382E
- 2D231C
- 16100B
- 030201
Tony
- F0C7AB
- E3BFA7
- D6B7A2
- CAAF9D
- BDA798
- B19F93
- A4978F
- 988F8A
- 8C8885
Harmonie kolorów
Komplementarna +180°
- FDCFB0
Vintage Peach
- B1E1FF
≈ Frozen Landscape
Analogowa -30° +30°
- FDCFB0
Vintage Peach
- FFCBC6
≈ Piggy Dreams
- EED7A8
≈ Cereal Flake
Triada +120° +240°
- FDCFB0
Vintage Peach
- ABE9D8
≈ Sweet Aqua
- DCD2FF
≈ Pale Lavender
Komplementarna rozszczepiona +150° +210°
- FDCFB0
Vintage Peach
- A5E7EF
≈ Uranus
- C8DAFF
≈ Arc Light
Tetrada +90° +180° +270°
- FDCFB0
Vintage Peach
- BFE6C0
≈ Lime Sorbet
- B1E1FF
≈ Frozen Landscape
- F1CBF2
≈ Bubblegum Crisis
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.42:1 · APCA Lc 20
Ag
AAANa czerni
WCAG 14.72:1 · APCA Lc 83
Najlepszy kolor tekstu: #000000
WCAG 14.72:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--vintage-peach: #fdcfb0;
--vintage-peach-rgb: 253 207 176;
--vintage-peach-oklch: oklch(0.887 0.067 55.7);
}
.element {
color: var(--vintage-peach);
background-color: hsl(24 95% 84%);
border-color: oklch(0.887 0.067 55.7);
}Tailwind CSS v4
@theme {
--color-vintage-peach: #fdcfb0;
--color-vintage-peach-50: #fff1e3;
--color-vintage-peach-100: #fae3d3;
--color-vintage-peach-200: #ebceb9;
--color-vintage-peach-300: #d2b097;
--color-vintage-peach-400: #be9579;
--color-vintage-peach-500: #a97b5b;
--color-vintage-peach-600: #8f684d;
--color-vintage-peach-700: #72533d;
--color-vintage-peach-800: #553c2c;
--color-vintage-peach-900: #3b291e;
--color-vintage-peach-950: #25170e;
}SCSS
$vintage-peach: #fdcfb0;
$vintage-peach-rgb: 253, 207, 176;
$vintage-peach-light: mix(#fff, $vintage-peach, 20%);
$vintage-peach-dark: mix(#000, $vintage-peach, 20%);
.element {
color: $vintage-peach;
box-shadow: 0 0 0 2px rgba($vintage-peach, 0.35);
}