이름 색상 · #FFC512
Sunflower
Sunflower은(는) #FFC512: rgb(255 197 18), hsl(45 100% 54%), oklch(0.852 0.172 86.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Yellow mean? → · Sunflower color name →
#FFC512
oklch(0.852 0.172 86.7)
색상 변환
- HEX
- #ffc512
- RGB
- rgb(255 197 18)
- HSL
- hsl(45 100% 54%)
- HWB
- hwb(45 7% 0%)
- OKLCH
- oklch(0.852 0.172 86.7)
- OKLab
- oklab(0.852 0.01 0.172)
- CIE Lab
- lab(83.08 11.78 81.93)
- LCH
- lch(83.08 82.78 81.8)
- CMYK
- cmyk(0% 23% 93% 0%)
틴트 · 셰이드 · 톤
틴트
- FFCB46
- FFD263
- FFD87B
- FFDE90
- FFE4A4
- FFE9B7
- FFEFCA
- FFF4DC
- FFFAED
셰이드
- DEAB0E
- BE920A
- 9E7907
- 806104
- 634B02
- 483501
- 2E2101
- 160E00
- 030200
톤
- F2BE35
- E5B847
- D8B153
- CBAA5E
- BEA366
- B19C6D
- A59573
- 988E78
- 8C877C
색 조화
보색 +180°
- FFC512
Sunflower
- B9CEFF
≈ Ice Cold Stare
유사색 -30° +30°
- FFC512
Sunflower
- FFBF91
≈ Sunset Cruise
- C8DC44
≈ Las Palmas
삼각 배색 +120° +240°
- FFC512
Sunflower
- 00E8FE
≈ Whimsical Blue
- FFADFF
≈ Jigglypuff
분열 보색 +150° +210°
- FFC512
Sunflower
- 99D7FF
≈ Shiva Blue
- D3C4FF
≈ Innocent Snowdrop
사각 배색 +90° +180° +270°
- FFC512
Sunflower
- 00EFCC
≈ Fake Jade
- B9CEFF
≈ Ice Cold Stare
- FFB6CF
≈ Baby Pink
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.58:1 · APCA Lc 26
Ag
AAA검은색 위
WCAG 13.24:1 · APCA Lc 77
가장 좋은 글자색: #000000
WCAG 13.24:1 (AAA) · APCA Lc 77
Contrast pairs
코드 스니펫
CSS
:root {
--sunflower: #ffc512;
--sunflower-rgb: 255 197 18;
--sunflower-oklch: oklch(0.852 0.172 86.7);
}
.element {
color: var(--sunflower);
background-color: hsl(45 100% 54%);
border-color: oklch(0.852 0.172 86.7);
}Tailwind CSS v4
@theme {
--color-sunflower: #ffc512;
--color-sunflower-50: #fff3bd;
--color-sunflower-100: #ffe6a5;
--color-sunflower-200: #f2d17b;
--color-sunflower-300: #dbb23e;
--color-sunflower-400: #ca9500;
--color-sunflower-500: #b77900;
--color-sunflower-600: #9a6700;
--color-sunflower-700: #7c5200;
--color-sunflower-800: #5d3b00;
--color-sunflower-900: #412800;
--color-sunflower-950: #2a1600;
}SCSS
$sunflower: #ffc512;
$sunflower-rgb: 255, 197, 18;
$sunflower-light: mix(#fff, $sunflower, 20%);
$sunflower-dark: mix(#000, $sunflower, 20%);
.element {
color: $sunflower;
box-shadow: 0 0 0 2px rgba($sunflower, 0.35);
}