이름 색상 · #F3D48B
Sprouted
Sprouted은(는) #F3D48B: rgb(243 212 139), hsl(42 81% 75%), oklch(0.88 0.098 87.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Yellow mean? → · Sprouted color name →
#F3D48B
oklch(0.88 0.098 87.4)
색상 변환
- 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%)
틴트 · 셰이드 · 톤
틴트
- F4D897
- F6DDA4
- F7E1AF
- F8E6BB
- F9EAC7
- FAEED2
- FCF2DD
- FDF7E9
- FEFBF4
셰이드
- D3B878
- B49D66
- 978354
- 7A6943
- 5E5132
- 443A23
- 2B2414
- 141007
- 030201
톤
- E7CB8B
- DBC38A
- CFBA8A
- C4B289
- B8A988
- ACA187
- A19985
- 969084
- 8B8882
색 조화
보색 +180°
- F3D48B
Sprouted
- C6D7FF
≈ Pale Phthalo Blue
유사색 -30° +30°
- F3D48B
Sprouted
- FFCCA6
≈ Light Saffron Orange
- D2E196
≈ Charming Green
삼각 배색 +120° +240°
- F3D48B
Sprouted
- 83EAF9
≈ Photon Projector
- FBC1F9
≈ Electric Lavender
분열 보색 +150° +210°
- F3D48B
Sprouted
- AEDFFF
≈ Droplet
- DCCFFF
≈ Pale Lavender
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.43:1 · APCA Lc 21
Ag
AAA검은색 위
WCAG 14.60:1 · APCA Lc 82
가장 좋은 글자색: #000000
WCAG 14.60:1 (AAA) · APCA Lc 82
Contrast pairs
코드 스니펫
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);
}