이름 색상 · #F0D39D
Sunbeam Yellow
Sunbeam Yellow은(는) #F0D39D: rgb(240 211 157), hsl(39 73% 78%), oklch(0.878 0.077 82.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · Sunbeam Yellow color name →
#F0D39D
oklch(0.878 0.077 82.7)
색상 변환
- HEX
- #f0d39d
- RGB
- rgb(240 211 157)
- HSL
- hsl(39 73% 78%)
- HWB
- hwb(39 62% 6%)
- OKLCH
- oklch(0.878 0.077 82.7)
- OKLab
- oklab(0.878 0.01 0.076)
- CIE Lab
- lab(86.07 4.89 30.72)
- LCH
- lch(86.07 31.11 81)
- CMYK
- cmyk(0% 12% 35% 6%)
틴트 · 셰이드 · 톤
틴트
- F2D7A7
- F3DCB1
- F5E0BB
- F6E5C5
- F8E9CF
- F9EED8
- FBF2E2
- FCF6EC
- FEFBF5
셰이드
- D1B788
- B29C73
- 95825F
- 78694C
- 5D513A
- 433A28
- 2A2418
- 141009
- 030201
톤
- E4CA9B
- D9C298
- CDBA95
- C2B192
- B7A990
- ABA18D
- A0988A
- 959087
- 8B8883
색 조화
보색 +180°
- F0D39D
Sunbeam Yellow
- C3D8FF
≈ Pale Phthalo Blue
유사색 -30° +30°
- F0D39D
Sunbeam Yellow
- FFCAAA
≈ Peachy Pico
- D7DDA2
≈ Burgundy Grey
삼각 배색 +120° +240°
- F0D39D
Sunbeam Yellow
- 99E7ED
≈ Blizzard Blue
- F0C7F5
≈ Purple’s Baby Sister
분열 보색 +150° +210°
- F0D39D
Sunbeam Yellow
- A8E0FF
≈ Droplet
- D8D0FF
≈ Pale Lavender
사각 배색 +90° +180° +270°
- F0D39D
Sunbeam Yellow
- A2E8D2
≈ Sweet Aqua
- C3D8FF
≈ Pale Phthalo Blue
- FFC3DB
≈ Sweet Romance
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.44:1 · APCA Lc 21
Ag
AAA검은색 위
WCAG 14.50:1 · APCA Lc 82
가장 좋은 글자색: #000000
WCAG 14.50:1 (AAA) · APCA Lc 82
Contrast pairs
코드 스니펫
CSS
:root {
--sunbeam-yellow: #f0d39d;
--sunbeam-yellow-rgb: 240 211 157;
--sunbeam-yellow-oklch: oklch(0.878 0.077 82.7);
}
.element {
color: var(--sunbeam-yellow);
background-color: hsl(39 73% 78%);
border-color: oklch(0.878 0.077 82.7);
}Tailwind CSS v4
@theme {
--color-sunbeam-yellow: #f0d39d;
--color-sunbeam-yellow-50: #fff4dd;
--color-sunbeam-yellow-100: #f4e6cc;
--color-sunbeam-yellow-200: #e4d2b0;
--color-sunbeam-yellow-300: #cab58b;
--color-sunbeam-yellow-400: #b59b69;
--color-sunbeam-yellow-500: #9f8148;
--color-sunbeam-yellow-600: #866e3d;
--color-sunbeam-yellow-700: #6c5831;
--color-sunbeam-yellow-800: #504022;
--color-sunbeam-yellow-900: #382c16;
--color-sunbeam-yellow-950: #221908;
}SCSS
$sunbeam-yellow: #f0d39d;
$sunbeam-yellow-rgb: 240, 211, 157;
$sunbeam-yellow-light: mix(#fff, $sunbeam-yellow, 20%);
$sunbeam-yellow-dark: mix(#000, $sunbeam-yellow, 20%);
.element {
color: $sunbeam-yellow;
box-shadow: 0 0 0 2px rgba($sunbeam-yellow, 0.35);
}