Nazwany kolor · #FDD5B1
Forgotten Sunset
Forgotten Sunset to #FDD5B1: rgb(253 213 177), hsl(28 95% 84%), oklch(0.898 0.065 63.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Forgotten Sunset color name →
#FDD5B1
oklch(0.898 0.065 63.8)
Konwersje koloru
- HEX
- #fdd5b1
- RGB
- rgb(253 213 177)
- HSL
- hsl(28 95% 84%)
- HWB
- hwb(28 69% 1%)
- OKLCH
- oklch(0.898 0.065 63.8)
- OKLab
- oklab(0.898 0.029 0.059)
- CIE Lab
- lab(88.07 10.71 23.35)
- LCH
- lch(88.07 25.69 65.4)
- CMYK
- cmyk(0% 16% 30% 1%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FDD9B9
- FEDDC1
- FEE2C9
- FEE6D0
- FFEAD8
- FFEEE0
- FFF3E8
- FFF7EF
- FFFBF7
Odcienie ciemniejsze
- DCB999
- BC9E83
- 9D836C
- 7F6A57
- 625142
- 473A2F
- 2D241C
- 16100C
- 030201
Tony
- F0CCAC
- E3C4A7
- D6BBA3
- CAB29E
- BDAA99
- B0A194
- A4998F
- 98918A
- 8C8885
Harmonie kolorów
Komplementarna +180°
- FDD5B1
Forgotten Sunset
- C0E2FF
≈ Dithered Sky
Analogowa -30° +30°
- FDD5B1
Forgotten Sunset
- FFD1C6
≈ Snow Pa
- ECDDAD
≈ Creamy Ivory
Triada +120° +240°
- FDD5B1
Forgotten Sunset
- ADECE2
≈ Mint Tea
- E6D4FF
≈ Rose Dragée
Komplementarna rozszczepiona +150° +210°
- FDD5B1
Forgotten Sunset
- ACE9F8
≈ Beyond the Clouds
- D3DCFF
≈ Icy Plains
Tetrada +90° +180° +270°
- FDD5B1
Forgotten Sunset
- BDEBCA
≈ Slime Lime
- C0E2FF
≈ Dithered Sky
- F9CEF0
≈ Infra-White
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.36:1 · APCA Lc 18
Ag
AAANa czerni
WCAG 15.32:1 · APCA Lc 86
Najlepszy kolor tekstu: #000000
WCAG 15.32:1 (AAA) · APCA Lc 86
Contrast pairs
Fragmenty kodu
CSS
:root {
--forgotten-sunset: #fdd5b1;
--forgotten-sunset-rgb: 253 213 177;
--forgotten-sunset-oklch: oklch(0.898 0.065 63.8);
}
.element {
color: var(--forgotten-sunset);
background-color: hsl(28 95% 84%);
border-color: oklch(0.898 0.065 63.8);
}Tailwind CSS v4
@theme {
--color-forgotten-sunset: #fdd5b1;
--color-forgotten-sunset-50: #fff2e2;
--color-forgotten-sunset-100: #f8e4d2;
--color-forgotten-sunset-200: #e8cfb8;
--color-forgotten-sunset-300: #cfb195;
--color-forgotten-sunset-400: #ba9776;
--color-forgotten-sunset-500: #a57d58;
--color-forgotten-sunset-600: #8b6a4b;
--color-forgotten-sunset-700: #70553b;
--color-forgotten-sunset-800: #533d2b;
--color-forgotten-sunset-900: #3a2a1d;
--color-forgotten-sunset-950: #24180d;
}SCSS
$forgotten-sunset: #fdd5b1;
$forgotten-sunset-rgb: 253, 213, 177;
$forgotten-sunset-light: mix(#fff, $forgotten-sunset, 20%);
$forgotten-sunset-dark: mix(#000, $forgotten-sunset, 20%);
.element {
color: $forgotten-sunset;
box-shadow: 0 0 0 2px rgba($forgotten-sunset, 0.35);
}