Najbliższy nazwany kolor · #FDE68A
#FDE68A
Najbliższy nazwany kolor: Quack Quack
#FDE68A (rgb(253 230 138), hsl(48 97% 77%), oklch(0.924 0.115 95.7)) jest najbliższy nazwanemu kolorowi Quack Quack. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#FDE68A
oklch(0.924 0.115 95.7)
Konwersje koloru
- HEX
- #fde68a
- RGB
- rgb(253 230 138)
- HSL
- hsl(48 97% 77%)
- HWB
- hwb(48 54% 1%)
- OKLCH
- oklch(0.924 0.115 95.7)
- OKLab
- oklab(0.924 -0.012 0.115)
- CIE Lab
- lab(91.74 -0.63 47.6)
- LCH
- lch(91.74 47.6 90.8)
- CMYK
- cmyk(0% 9% 45% 1%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FDE997
- FDEBA4
- FEEEB0
- FEF1BC
- FEF3C7
- FEF6D3
- FEF8DE
- FFFAE9
- FFFDF4
Odcienie ciemniejsze
- DCC877
- BCAB65
- 9D8E53
- 7F7342
- 625932
- 474022
- 2D2814
- 161307
- 030301
Tony
- F0DB8A
- E3D18A
- D6C78A
- C9BC89
- BCB288
- B0A887
- A49E86
- 989484
- 8C8A82
Harmonie kolorów
Komplementarna +180°
- FDE68A
Quack Quack
- DFE5FF
≈ Lavender Mist
Analogowa -30° +30°
- FDE68A
Quack Quack
- FFE0C2
≈ Sand Muffin
- D3F49F
≈ Creamy Avocado
Triada +120° +240°
- FDE68A
Quack Quack
- BAF1FF
≈ Northrend
- FFD9F5
≈ Strawberry Frost
Komplementarna rozszczepiona +150° +210°
- FDE68A
Quack Quack
- D2E9FF
≈ Veiling Waterfalls
- EDDFFF
≈ Lavender Savour
Tetrada +90° +180° +270°
- FDE68A
Quack Quack
- 82FFF1
≈ Defence Matrix
- DFE5FF
≈ Lavender Mist
- FFDCE2
≈ It’s a Girl!
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.24:1 · APCA Lc 12
Ag
AAANa czerni
WCAG 16.86:1 · APCA Lc 92
Najlepszy kolor tekstu: #000000
WCAG 16.86:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmenty kodu
CSS
:root {
--quack-quack: #fde68a;
--quack-quack-rgb: 253 230 138;
--quack-quack-oklch: oklch(0.924 0.115 95.7);
}
.element {
color: var(--quack-quack);
background-color: hsl(48 97% 77%);
border-color: oklch(0.924 0.115 95.7);
}Tailwind CSS v4
@theme {
--color-quack-quack: #fde68a;
--color-quack-quack-50: #fef6d1;
--color-quack-quack-100: #f2e9bd;
--color-quack-quack-200: #e1d59d;
--color-quack-quack-300: #c7b872;
--color-quack-quack-400: #b39e47;
--color-quack-quack-500: #9d8504;
--color-quack-quack-600: #85700d;
--color-quack-quack-700: #6b5a0c;
--color-quack-quack-800: #504105;
--color-quack-quack-900: #372d04;
--color-quack-quack-950: #221a00;
}SCSS
$quack-quack: #fde68a;
$quack-quack-rgb: 253, 230, 138;
$quack-quack-light: mix(#fff, $quack-quack, 20%);
$quack-quack-dark: mix(#000, $quack-quack, 20%);
.element {
color: $quack-quack;
box-shadow: 0 0 0 2px rgba($quack-quack, 0.35);
}