Nazwany kolor · #F7C85F
Little Sun Dress
Little Sun Dress to #F7C85F: rgb(247 200 95), hsl(41 90% 67%), oklch(0.854 0.133 85.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Little Sun Dress color name →
#F7C85F
oklch(0.854 0.133 85.1)
Konwersje koloru
- HEX
- #f7c85f
- RGB
- rgb(247 200 95)
- HSL
- hsl(41 90% 67%)
- HWB
- hwb(41 37% 3%)
- OKLCH
- oklch(0.854 0.133 85.1)
- OKLab
- oklab(0.854 0.011 0.133)
- CIE Lab
- lab(83.33 8.98 57.78)
- LCH
- lch(83.33 58.47 81.2)
- CMYK
- cmyk(0% 19% 62% 3%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F8CE73
- F9D484
- FAD995
- FBDFA5
- FBE4B5
- FCEAC4
- FDEFD3
- FEF5E2
- FEFAF0
Odcienie ciemniejsze
- D7AE52
- B79444
- 997B38
- 7C632C
- 604C20
- 453615
- 2C210A
- 150F03
- 030200
Tony
- EBC165
- DEBA6B
- D2B26F
- C6AB73
- BAA476
- AE9D79
- A2967B
- 978E7D
- 8B877F
Harmonie kolorów
Komplementarna +180°
- F7C85F
Little Sun Dress
- B8CFFF
≈ Ice Cold Stare
Analogowa -30° +30°
- F7C85F
Little Sun Dress
- FFC095
≈ Wispy White
- CCD96E
≈ Cool as a Cucumber
Triada +120° +240°
- F7C85F
Little Sun Dress
- 3FE8F9
≈ Shimmering Expanse Cyan
- FBB0FF
≈ Strawberry Buttercream
Komplementarna rozszczepiona +150° +210°
- F7C85F
Little Sun Dress
- 98D9FF
≈ Shiva Blue
- D2C5FF
≈ Innocent Snowdrop
Tetrada +90° +180° +270°
- F7C85F
Little Sun Dress
- 5AEBCA
≈ Aphrodite Aqua
- B8CFFF
≈ Ice Cold Stare
- FFB7D2
≈ Candy Bar
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.56:1 · APCA Lc 26
Ag
AAANa czerni
WCAG 13.38:1 · APCA Lc 77
Najlepszy kolor tekstu: #000000
WCAG 13.38:1 (AAA) · APCA Lc 77
Contrast pairs
Fragmenty kodu
CSS
:root {
--little-sun-dress: #f7c85f;
--little-sun-dress-rgb: 247 200 95;
--little-sun-dress-oklch: oklch(0.854 0.133 85.1);
}
.element {
color: var(--little-sun-dress);
background-color: hsl(41 90% 67%);
border-color: oklch(0.854 0.133 85.1);
}Tailwind CSS v4
@theme {
--color-little-sun-dress: #f7c85f;
--color-little-sun-dress-50: #fff4ca;
--color-little-sun-dress-100: #fbe6b5;
--color-little-sun-dress-200: #edd192;
--color-little-sun-dress-300: #d5b363;
--color-little-sun-dress-400: #c29730;
--color-little-sun-dress-500: #ae7d00;
--color-little-sun-dress-600: #936a00;
--color-little-sun-dress-700: #765500;
--color-little-sun-dress-800: #583d00;
--color-little-sun-dress-900: #3e2a00;
--color-little-sun-dress-950: #271700;
}SCSS
$little-sun-dress: #f7c85f;
$little-sun-dress-rgb: 247, 200, 95;
$little-sun-dress-light: mix(#fff, $little-sun-dress, 20%);
$little-sun-dress-dark: mix(#000, $little-sun-dress, 20%);
.element {
color: $little-sun-dress;
box-shadow: 0 0 0 2px rgba($little-sun-dress, 0.35);
}