Nazwany kolor · #F5E0B1
Friendly Yellow
Friendly Yellow to #F5E0B1: rgb(245 224 177), hsl(41 77% 83%), oklch(0.912 0.065 86.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Friendly Yellow color name →
#F5E0B1
oklch(0.912 0.065 86.7)
Konwersje koloru
- HEX
- #f5e0b1
- RGB
- rgb(245 224 177)
- HSL
- hsl(41 77% 83%)
- HWB
- hwb(41 69% 4%)
- OKLCH
- oklch(0.912 0.065 86.7)
- OKLab
- oklab(0.912 0.004 0.065)
- CIE Lab
- lab(90.05 2.32 25.86)
- LCH
- lch(90.05 25.97 84.9)
- CMYK
- cmyk(0% 9% 28% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F6E3B9
- F7E6C1
- F8E9C9
- F9EDD1
- FAF0D8
- FBF3E0
- FCF6E8
- FDF9F0
- FEFCF7
Odcienie ciemniejsze
- D5C399
- B6A683
- 988A6C
- 7B7057
- 5F5642
- 443E2F
- 2B271C
- 15120C
- 030201
Tony
- E9D6AC
- DDCCA7
- D1C2A3
- C5B99E
- B9AF99
- ADA594
- A29C8F
- 96938A
- 8B8985
Harmonie kolorów
Komplementarna +180°
- F5E0B1
Friendly Yellow
- D5E2FF
≈ Stoic White
Analogowa -30° +30°
- F5E0B1
Friendly Yellow
- FFDAC0
≈ Karry
- DFE8B7
≈ Budding Bloom
Triada +120° +240°
- F5E0B1
Friendly Yellow
- AFEFF8
≈ Beyond the Clouds
- FAD4F9
≈ Pink Diamond
Komplementarna rozszczepiona +150° +210°
- F5E0B1
Friendly Yellow
- C4E8FF
≈ Blue Java Banana
- E5DCFF
≈ Contrail
Tetrada +90° +180° +270°
- F5E0B1
Friendly Yellow
- B4F1E1
≈ East Cape
- D5E2FF
≈ Stoic White
- FFD5E3
≈ Powder Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.29:1 · APCA Lc 15
Ag
AAANa czerni
WCAG 16.17:1 · APCA Lc 89
Najlepszy kolor tekstu: #000000
WCAG 16.17:1 (AAA) · APCA Lc 89
Contrast pairs
Fragmenty kodu
CSS
:root {
--friendly-yellow: #f5e0b1;
--friendly-yellow-rgb: 245 224 177;
--friendly-yellow-oklch: oklch(0.912 0.065 86.7);
}
.element {
color: var(--friendly-yellow);
background-color: hsl(41 77% 83%);
border-color: oklch(0.912 0.065 86.7);
}Tailwind CSS v4
@theme {
--color-friendly-yellow: #f5e0b1;
--color-friendly-yellow-50: #fdf5e1;
--color-friendly-yellow-100: #f1e7d0;
--color-friendly-yellow-200: #dfd3b5;
--color-friendly-yellow-300: #c5b692;
--color-friendly-yellow-400: #af9c72;
--color-friendly-yellow-500: #998453;
--color-friendly-yellow-600: #816f46;
--color-friendly-yellow-700: #685938;
--color-friendly-yellow-800: #4d4128;
--color-friendly-yellow-900: #352d1a;
--color-friendly-yellow-950: #211a0b;
}SCSS
$friendly-yellow: #f5e0b1;
$friendly-yellow-rgb: 245, 224, 177;
$friendly-yellow-light: mix(#fff, $friendly-yellow, 20%);
$friendly-yellow-dark: mix(#000, $friendly-yellow, 20%);
.element {
color: $friendly-yellow;
box-shadow: 0 0 0 2px rgba($friendly-yellow, 0.35);
}