Nazwany kolor · #F5D39C
Mellow Sun
Mellow Sun to #F5D39C: rgb(245 211 156), hsl(37 82% 79%), oklch(0.883 0.08 79.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Mellow Sun color name →
#F5D39C
oklch(0.883 0.08 79.4)
Konwersje koloru
- HEX
- #f5d39c
- RGB
- rgb(245 211 156)
- HSL
- hsl(37 82% 79%)
- HWB
- hwb(37 61% 4%)
- OKLCH
- oklch(0.883 0.08 79.4)
- OKLab
- oklab(0.883 0.015 0.079)
- CIE Lab
- lab(86.52 6.75 31.92)
- LCH
- lch(86.52 32.63 78.1)
- CMYK
- cmyk(0% 14% 36% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F6D7A6
- F7DCB0
- F8E0BA
- F9E5C4
- FAE9CE
- FBEED8
- FCF2E2
- FDF6EC
- FEFBF5
Odcienie ciemniejsze
- D5B787
- B69C73
- 98825F
- 7B694C
- 5F5139
- 443A28
- 2B2418
- 151009
- 030201
Tony
- E9CA9A
- DDC297
- D1BA95
- C5B192
- B9A98F
- ADA18C
- A29889
- 969086
- 8B8883
Harmonie kolorów
Komplementarna +180°
- F5D39C
Mellow Sun
- C2DAFF
≈ Broad Daylight
Analogowa -30° +30°
- F5D39C
Mellow Sun
- FFCCB1
≈ Blushing Cherub
- DCDDA0
≈ Burgundy Grey
Triada +120° +240°
- F5D39C
Mellow Sun
- 97E9ED
≈ Freezy Breezy
- F0C8FA
≈ Aquarelle Lilac
Komplementarna rozszczepiona +150° +210°
- F5D39C
Mellow Sun
- A7E2FF
≈ Ganon Blue
- D7D2FF
≈ Pale Lavender
Tetrada +90° +180° +270°
- F5D39C
Mellow Sun
- A3EAD0
≈ Tropical
- C2DAFF
≈ Broad Daylight
- FFC5E0
≈ Sweet Romance
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.43:1 · APCA Lc 21
Ag
AAANa czerni
WCAG 14.68:1 · APCA Lc 83
Najlepszy kolor tekstu: #000000
WCAG 14.68:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--mellow-sun: #f5d39c;
--mellow-sun-rgb: 245 211 156;
--mellow-sun-oklch: oklch(0.883 0.08 79.4);
}
.element {
color: var(--mellow-sun);
background-color: hsl(37 82% 79%);
border-color: oklch(0.883 0.08 79.4);
}Tailwind CSS v4
@theme {
--color-mellow-sun: #f5d39c;
--color-mellow-sun-50: #fff3dc;
--color-mellow-sun-100: #f6e6ca;
--color-mellow-sun-200: #e6d1ae;
--color-mellow-sun-300: #ccb489;
--color-mellow-sun-400: #b89967;
--color-mellow-sun-500: #a38045;
--color-mellow-sun-600: #896c3b;
--color-mellow-sun-700: #6e572f;
--color-mellow-sun-800: #523f21;
--color-mellow-sun-900: #392b15;
--color-mellow-sun-950: #231807;
}SCSS
$mellow-sun: #f5d39c;
$mellow-sun-rgb: 245, 211, 156;
$mellow-sun-light: mix(#fff, $mellow-sun, 20%);
$mellow-sun-dark: mix(#000, $mellow-sun, 20%);
.element {
color: $mellow-sun;
box-shadow: 0 0 0 2px rgba($mellow-sun, 0.35);
}