이름 색상 · #F1D3CA
Cool Cantaloupe
Cool Cantaloupe은(는) #F1D3CA: rgb(241 211 202), hsl(14 58% 87%), oklch(0.889 0.036 37.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Pink mean? → · Cool Cantaloupe color name →
#F1D3CA
oklch(0.889 0.036 37.4)
색상 변환
- HEX
- #f1d3ca
- RGB
- rgb(241 211 202)
- HSL
- hsl(14 58% 87%)
- HWB
- hwb(14 79% 5%)
- OKLCH
- oklch(0.889 0.036 37.4)
- OKLab
- oklab(0.889 0.029 0.022)
- CIE Lab
- lab(86.92 9.75 8.52)
- LCH
- lch(86.92 12.95 41.1)
- CMYK
- cmyk(0% 12% 16% 5%)
틴트 · 셰이드 · 톤
틴트
- F3D7CF
- F4DCD4
- F5E0DA
- F7E5DF
- F8E9E4
- FAEDEA
- FBF2EF
- FCF6F4
- FEFBFA
셰이드
- D2B7AF
- B39C95
- 95827C
- 796964
- 5D514D
- 433A37
- 2B2422
- 14100F
- 030202
톤
- E5CAC2
- DAC2BB
- CEB9B3
- C2B1AC
- B7A9A4
- ACA09D
- A19896
- 96908E
- 8B8887
색 조화
보색 +180°
- F1D3CA
Cool Cantaloupe
- C1E1EA
≈ Cotton Clouds
유사색 -30° +30°
- F1D3CA
Cool Cantaloupe
- F1D1D6
≈ Impatiens Petal
- EBD7C2
≈ Antique Parchment
삼각 배색 +120° +240°
- F1D3CA
Cool Cantaloupe
- C8E2D1
≈ Duck Egg Cream
- D4D9F3
≈ Flax Bloom
분열 보색 +150° +210°
- F1D3CA
Cool Cantaloupe
- C1E3DF
≈ Tidewater
- C8DDF2
≈ Blue Booties
사각 배색 +90° +180° +270°
- F1D3CA
Cool Cantaloupe
- D4DFC6
≈ Dream Seascape
- C1E1EA
≈ Cotton Clouds
- E1D5EE
≈ Light Purity
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.40:1 · APCA Lc 20
Ag
AAA검은색 위
WCAG 14.91:1 · APCA Lc 84
가장 좋은 글자색: #000000
WCAG 14.91:1 (AAA) · APCA Lc 84
Contrast pairs
코드 스니펫
CSS
:root {
--cool-cantaloupe: #f1d3ca;
--cool-cantaloupe-rgb: 241 211 202;
--cool-cantaloupe-oklch: oklch(0.889 0.036 37.4);
}
.element {
color: var(--cool-cantaloupe);
background-color: hsl(14 58% 87%);
border-color: oklch(0.889 0.036 37.4);
}Tailwind CSS v4
@theme {
--color-cool-cantaloupe: #f1d3ca;
--color-cool-cantaloupe-50: #fff2ee;
--color-cool-cantaloupe-100: #f3e4df;
--color-cool-cantaloupe-200: #e3cfc9;
--color-cool-cantaloupe-300: #c9b2aa;
--color-cool-cantaloupe-400: #b29890;
--color-cool-cantaloupe-500: #9c7e75;
--color-cool-cantaloupe-600: #846b64;
--color-cool-cantaloupe-700: #6a564f;
--color-cool-cantaloupe-800: #4e3e3a;
--color-cool-cantaloupe-900: #362b28;
--color-cool-cantaloupe-950: #211816;
}SCSS
$cool-cantaloupe: #f1d3ca;
$cool-cantaloupe-rgb: 241, 211, 202;
$cool-cantaloupe-light: mix(#fff, $cool-cantaloupe, 20%);
$cool-cantaloupe-dark: mix(#000, $cool-cantaloupe, 20%);
.element {
color: $cool-cantaloupe;
box-shadow: 0 0 0 2px rgba($cool-cantaloupe, 0.35);
}