Colore con nome · #F3D48B
Sprouted
Sprouted è #F3D48B: rgb(243 212 139), hsl(42 81% 75%), oklch(0.88 0.098 87.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Sprouted color name →
#F3D48B
oklch(0.88 0.098 87.4)
Conversioni di colore
- HEX
- #f3d48b
- RGB
- rgb(243 212 139)
- HSL
- hsl(42 81% 75%)
- HWB
- hwb(42 55% 5%)
- OKLCH
- oklch(0.88 0.098 87.4)
- OKLab
- oklab(0.88 0.004 0.098)
- CIE Lab
- lab(86.36 4.14 40.25)
- LCH
- lch(86.36 40.46 84.1)
- CMYK
- cmyk(0% 13% 43% 5%)
Tinte · Ombre · Toni
Tinte
- F4D897
- F6DDA4
- F7E1AF
- F8E6BB
- F9EAC7
- FAEED2
- FCF2DD
- FDF7E9
- FEFBF4
Ombre
- D3B878
- B49D66
- 978354
- 7A6943
- 5E5132
- 443A23
- 2B2414
- 141007
- 030201
Toni
- E7CB8B
- DBC38A
- CFBA8A
- C4B289
- B8A988
- ACA187
- A19985
- 969084
- 8B8882
Armonie di colore
Complementare +180°
- F3D48B
Sprouted
- C6D7FF
≈ Pale Phthalo Blue
Analogo -30° +30°
- F3D48B
Sprouted
- FFCCA6
≈ Light Saffron Orange
- D2E196
≈ Charming Green
Triadico +120° +240°
- F3D48B
Sprouted
- 83EAF9
≈ Photon Projector
- FBC1F9
≈ Electric Lavender
Complementare divisa +150° +210°
- F3D48B
Sprouted
- AEDFFF
≈ Droplet
- DCCFFF
≈ Pale Lavender
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.43:1 · APCA Lc 21
Ag
AAASu nero
WCAG 14.60:1 · APCA Lc 82
Miglior colore del testo: #000000
WCAG 14.60:1 (AAA) · APCA Lc 82
Contrast pairs
Frammenti di codice
CSS
:root {
--sprouted: #f3d48b;
--sprouted-rgb: 243 212 139;
--sprouted-oklch: oklch(0.88 0.098 87.4);
}
.element {
color: var(--sprouted);
background-color: hsl(42 81% 75%);
border-color: oklch(0.88 0.098 87.4);
}Tailwind CSS v4
@theme {
--color-sprouted: #f3d48b;
--color-sprouted-50: #fff4d6;
--color-sprouted-100: #f5e7c3;
--color-sprouted-200: #e5d3a5;
--color-sprouted-300: #cbb57d;
--color-sprouted-400: #b79b57;
--color-sprouted-500: #a2822d;
--color-sprouted-600: #896e28;
--color-sprouted-700: #6e5820;
--color-sprouted-800: #523f15;
--color-sprouted-900: #392c0d;
--color-sprouted-950: #231902;
}SCSS
$sprouted: #f3d48b;
$sprouted-rgb: 243, 212, 139;
$sprouted-light: mix(#fff, $sprouted, 20%);
$sprouted-dark: mix(#000, $sprouted, 20%);
.element {
color: $sprouted;
box-shadow: 0 0 0 2px rgba($sprouted, 0.35);
}