이름 색상 · #F7BEA2
Coral Blossom
Coral Blossom은(는) #F7BEA2: rgb(247 190 162), hsl(20 84% 80%), oklch(0.846 0.076 47.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · Coral Blossom color name →
#F7BEA2
oklch(0.846 0.076 47.4)
색상 변환
- HEX
- #f7bea2
- RGB
- rgb(247 190 162)
- HSL
- hsl(20 84% 80%)
- HWB
- hwb(20 64% 3%)
- OKLCH
- oklch(0.846 0.076 47.4)
- OKLab
- oklab(0.846 0.052 0.056)
- CIE Lab
- lab(81.73 18.41 22.5)
- LCH
- lch(81.73 29.08 50.7)
- CMYK
- cmyk(0% 23% 34% 3%)
틴트 · 셰이드 · 톤
틴트
- F8C5AB
- F9CBB5
- FAD2BE
- FBD8C7
- FCDFD0
- FDE5DA
- FEECE3
- FEF2EC
- FFF9F6
셰이드
- D7A58C
- B78C77
- 997563
- 7C5E4F
- 60483C
- 45332A
- 2C1F19
- 150D0A
- 030201
톤
- EBB89F
- DFB19B
- D2AB98
- C6A595
- BB9F91
- AF998E
- A3928B
- 978C87
- 8C8684
색 조화
보색 +180°
- F7BEA2
Coral Blossom
- 97D7F4
≈ Juzcar Blue
유사색 -30° +30°
- F7BEA2
Coral Blossom
- FAB9BA
≈ Peach Whisper
- E9C794
≈ Chestnut Dressing
삼각 배색 +120° +240°
- F7BEA2
Coral Blossom
- 9CDDC2
≈ Almost Aqua
- C9C5FC
≈ Light Periwinkle
분열 보색 +150° +210°
- F7BEA2
Coral Blossom
- 8FDCDE
≈ Paradisiacal Getaway
- ADCFFF
≈ Night Snow
사각 배색 +90° +180° +270°
- F7BEA2
Coral Blossom
- B5D9A8
≈ Apple Cream
- 97D7F4
≈ Juzcar Blue
- E1BDEE
≈ Beefy Pink
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.63:1 · APCA Lc 28
Ag
AAA검은색 위
WCAG 12.84:1 · APCA Lc 75
가장 좋은 글자색: #000000
WCAG 12.84:1 (AAA) · APCA Lc 75
Contrast pairs
코드 스니펫
CSS
:root {
--coral-blossom: #f7bea2;
--coral-blossom-rgb: 247 190 162;
--coral-blossom-oklch: oklch(0.846 0.076 47.4);
}
.element {
color: var(--coral-blossom);
background-color: hsl(20 84% 80%);
border-color: oklch(0.846 0.076 47.4);
}Tailwind CSS v4
@theme {
--color-coral-blossom: #f7bea2;
--color-coral-blossom-50: #ffefe2;
--color-coral-blossom-100: #fee1d2;
--color-coral-blossom-200: #f0cbb8;
--color-coral-blossom-300: #d9ad95;
--color-coral-blossom-400: #c59178;
--color-coral-blossom-500: #b07659;
--color-coral-blossom-600: #95644c;
--color-coral-blossom-700: #77503d;
--color-coral-blossom-800: #593a2c;
--color-coral-blossom-900: #3e281e;
--color-coral-blossom-950: #27160e;
}SCSS
$coral-blossom: #f7bea2;
$coral-blossom-rgb: 247, 190, 162;
$coral-blossom-light: mix(#fff, $coral-blossom, 20%);
$coral-blossom-dark: mix(#000, $coral-blossom, 20%);
.element {
color: $coral-blossom;
box-shadow: 0 0 0 2px rgba($coral-blossom, 0.35);
}