이름 색상 · #FCE300
Flatty Yellow
Flatty Yellow은(는) #FCE300: rgb(252 227 0), hsl(54 100% 49%), oklch(0.908 0.19 101.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Yellow mean? → · Flatty Yellow color name →
#FCE300
oklch(0.908 0.19 101.3)
색상 변환
- HEX
- #fce300
- RGB
- rgb(252 227 0)
- HSL
- hsl(54 100% 49%)
- HWB
- hwb(54 0% 1%)
- OKLCH
- oklch(0.908 0.19 101.3)
- OKLab
- oklab(0.908 -0.037 0.186)
- CIE Lab
- lab(90.2 -4.06 88.2)
- LCH
- lch(90.2 88.3 92.6)
- CMYK
- cmyk(0% 10% 100% 1%)
틴트 · 셰이드 · 톤
틴트
- FCE647
- FCEA66
- FCED7E
- FDF094
- FDF3A8
- FDF5BA
- FEF8CC
- FEFADD
- FEFDEE
셰이드
- DBC500
- BBA800
- 9C8C00
- 7E7100
- 625700
- 473F00
- 2D2700
- 161200
- 030300
톤
- EFD933
- E2CF48
- D5C556
- C8BB60
- BCB168
- AFA86F
- A39E75
- 979479
- 8B8A7D
색 조화
보색 +180°
- FCE300
Flatty Yellow
- DBDEFF
≈ Transparent Blue
유사색 -30° +30°
- FCE300
Flatty Yellow
- FFDAAE
≈ Peach Cider
- B2FA69
≈ Stinging Wasabi
삼각 배색 +120° +240°
- FCE300
Flatty Yellow
- B2EBFF
≈ Beyond the Clouds
- FFD1ED
≈ Shampoo
분열 보색 +150° +210°
- FCE300
Flatty Yellow
- CBE4FF
≈ Fresh Water
- EED6FF
≈ Rose Dragée
사각 배색 +90° +180° +270°
- FCE300
Flatty Yellow
- 3CFFF8
≈ Beaming Blue
- DBDEFF
≈ Transparent Blue
- FFD4D8
≈ Pink Fluorite
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.30:1 · APCA Lc 15
Ag
AAA검은색 위
WCAG 16.12:1 · APCA Lc 89
가장 좋은 글자색: #000000
WCAG 16.12:1 (AAA) · APCA Lc 89
Contrast pairs
코드 스니펫
CSS
:root {
--flatty-yellow: #fce300;
--flatty-yellow-rgb: 252 227 0;
--flatty-yellow-oklch: oklch(0.908 0.19 101.3);
}
.element {
color: var(--flatty-yellow);
background-color: hsl(54 100% 49%);
border-color: oklch(0.908 0.19 101.3);
}Tailwind CSS v4
@theme {
--color-flatty-yellow: #fce300;
--color-flatty-yellow-50: #fef8b9;
--color-flatty-yellow-100: #f3eba1;
--color-flatty-yellow-200: #e3d873;
--color-flatty-yellow-300: #c9bb2d;
--color-flatty-yellow-400: #b79f00;
--color-flatty-yellow-500: #a38500;
--color-flatty-yellow-600: #897100;
--color-flatty-yellow-700: #6e5a00;
--color-flatty-yellow-800: #534100;
--color-flatty-yellow-900: #3a2d00;
--color-flatty-yellow-950: #241900;
}SCSS
$flatty-yellow: #fce300;
$flatty-yellow-rgb: 252, 227, 0;
$flatty-yellow-light: mix(#fff, $flatty-yellow, 20%);
$flatty-yellow-dark: mix(#000, $flatty-yellow, 20%);
.element {
color: $flatty-yellow;
box-shadow: 0 0 0 2px rgba($flatty-yellow, 0.35);
}