이름 색상 · #AFBEB0
Cottage Charm
Cottage Charm은(는) #AFBEB0: rgb(175 190 176), hsl(124 10% 72%), oklch(0.786 0.026 147.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Cottage Charm color name →
#AFBEB0
oklch(0.786 0.026 147.2)
색상 변환
- HEX
- #afbeb0
- RGB
- rgb(175 190 176)
- HSL
- hsl(124 10% 72%)
- HWB
- hwb(124 69% 25%)
- OKLCH
- oklch(0.786 0.026 147.2)
- OKLab
- oklab(0.786 -0.022 0.014)
- CIE Lab
- lab(75.5 -7.34 5.24)
- LCH
- lch(75.5 9.02 144.5)
- CMYK
- cmyk(8% 0% 7% 25%)
틴트 · 셰이드 · 톤
틴트
- B7C4B8
- BFCBBF
- C6D1C7
- CED8CF
- D6DED7
- DEE5DF
- E6EBE7
- EFF2EF
- F7F8F7
셰이드
- 98A599
- 818C82
- 6B756C
- 565E56
- 414842
- 2E332E
- 1C1F1C
- 0B0D0B
- 010201
톤
- AAB8AB
- A5B1A6
- A1ABA1
- 9CA59C
- 979E98
- 939893
- 8E928E
- 898C89
- 858685
색 조화
보색 +180°
- AFBEB0
Cottage Charm
- C3B4C2
≈ Pink Bravado
유사색 -30° +30°
- AFBEB0
Cottage Charm
- B8BCA9
≈ Softened Green
- A9BFB9
≈ Harbour Grey
삼각 배색 +120° +240°
- AFBEB0
Cottage Charm
- B2B9CA
≈ Heritage
- C9B3B0
≈ Rosy Linen
분열 보색 +150° +210°
- AFBEB0
Cottage Charm
- BBB6C8
≈ Axis
- C8B3B9
≈ Blossom Powder
사각 배색 +90° +180° +270°
- AFBEB0
Cottage Charm
- ABBCC8
≈ Simply Blue
- C3B4C2
≈ Pink Bravado
- C7B6AA
≈ Boardwalk Sashay
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.94:1 · APCA Lc 37
Ag
AAA검은색 위
WCAG 10.81:1 · APCA Lc 65
가장 좋은 글자색: #000000
WCAG 10.81:1 (AAA) · APCA Lc 65
Contrast pairs
코드 스니펫
CSS
:root {
--cottage-charm: #afbeb0;
--cottage-charm-rgb: 175 190 176;
--cottage-charm-oklch: oklch(0.786 0.026 147.2);
}
.element {
color: var(--cottage-charm);
background-color: hsl(124 10% 72%);
border-color: oklch(0.786 0.026 147.2);
}Tailwind CSS v4
@theme {
--color-cottage-charm: #afbeb0;
--color-cottage-charm-50: #f0f7f1;
--color-cottage-charm-100: #e2eae3;
--color-cottage-charm-200: #cdd7ce;
--color-cottage-charm-300: #afbbb0;
--color-cottage-charm-400: #95a396;
--color-cottage-charm-500: #7b8b7d;
--color-cottage-charm-600: #69766a;
--color-cottage-charm-700: #545e54;
--color-cottage-charm-800: #3d453d;
--color-cottage-charm-900: #2a302a;
--color-cottage-charm-950: #181c18;
}SCSS
$cottage-charm: #afbeb0;
$cottage-charm-rgb: 175, 190, 176;
$cottage-charm-light: mix(#fff, $cottage-charm, 20%);
$cottage-charm-dark: mix(#000, $cottage-charm, 20%);
.element {
color: $cottage-charm;
box-shadow: 0 0 0 2px rgba($cottage-charm, 0.35);
}