Nazwany kolor · #F6D099
Yellow Lotus
Yellow Lotus to #F6D099: rgb(246 208 153), hsl(35 84% 78%), oklch(0.877 0.083 76.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Yellow Lotus color name →
#F6D099
oklch(0.877 0.083 76.5)
Konwersje koloru
- HEX
- #f6d099
- RGB
- rgb(246 208 153)
- HSL
- hsl(35 84% 78%)
- HWB
- hwb(35 60% 4%)
- OKLCH
- oklch(0.877 0.083 76.5)
- OKLab
- oklab(0.877 0.019 0.08)
- CIE Lab
- lab(85.83 8.36 32.58)
- LCH
- lch(85.83 33.64 75.6)
- CMYK
- cmyk(0% 15% 38% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F7D5A4
- F8DAAE
- F9DEB8
- FAE3C3
- FBE8CD
- FCECD7
- FDF1E1
- FDF6EB
- FEFAF5
Odcienie ciemniejsze
- D6B584
- B79A70
- 98805D
- 7B674A
- 5F4F38
- 453927
- 2C2317
- 151008
- 030201
Tony
- EAC897
- DDC095
- D1B893
- C5AF90
- BAA78E
- AE9F8B
- A29889
- 979086
- 8B8883
Harmonie kolorów
Komplementarna +180°
- F6D099
Yellow Lotus
- BDD9FF
≈ Broad Daylight
Analogowa -30° +30°
- F6D099
Yellow Lotus
- FFC9B0
≈ Antique Coral
- DDDB9B
≈ Chalcedony
Triada +120° +240°
- F6D099
Yellow Lotus
- 93E8E9
≈ Aqua Fiesta
- EDC6FC
≈ Aquarelle Lilac
Komplementarna rozszczepiona +150° +210°
- F6D099
Yellow Lotus
- 9EE2FF
≈ Ganon Blue
- D3D1FF
≈ Pale Lavender
Tetrada +90° +180° +270°
- F6D099
Yellow Lotus
- A1E9CB
≈ Tropical
- BDD9FF
≈ Broad Daylight
- FFC2E1
≈ Sugarwinkle
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.45:1 · APCA Lc 22
Ag
AAANa czerni
WCAG 14.40:1 · APCA Lc 82
Najlepszy kolor tekstu: #000000
WCAG 14.40:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmenty kodu
CSS
:root {
--yellow-lotus: #f6d099;
--yellow-lotus-rgb: 246 208 153;
--yellow-lotus-oklch: oklch(0.877 0.083 76.5);
}
.element {
color: var(--yellow-lotus);
background-color: hsl(35 84% 78%);
border-color: oklch(0.877 0.083 76.5);
}Tailwind CSS v4
@theme {
--color-yellow-lotus: #f6d099;
--color-yellow-lotus-50: #fff3db;
--color-yellow-lotus-100: #f7e5ca;
--color-yellow-lotus-200: #e8d1ad;
--color-yellow-lotus-300: #cfb388;
--color-yellow-lotus-400: #ba9866;
--color-yellow-lotus-500: #a57f43;
--color-yellow-lotus-600: #8c6b3a;
--color-yellow-lotus-700: #70562e;
--color-yellow-lotus-800: #533e20;
--color-yellow-lotus-900: #3a2b15;
--color-yellow-lotus-950: #241807;
}SCSS
$yellow-lotus: #f6d099;
$yellow-lotus-rgb: 246, 208, 153;
$yellow-lotus-light: mix(#fff, $yellow-lotus, 20%);
$yellow-lotus-dark: mix(#000, $yellow-lotus, 20%);
.element {
color: $yellow-lotus;
box-shadow: 0 0 0 2px rgba($yellow-lotus, 0.35);
}