이름 색상 · #B7BF6B
Avocado Cream
Avocado Cream은(는) #B7BF6B: rgb(183 191 107), hsl(66 40% 58%), oklch(0.78 0.108 113.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Yellow mean? → · Avocado Cream color name →
#B7BF6B
oklch(0.78 0.108 113.4)
색상 변환
- HEX
- #b7bf6b
- RGB
- rgb(183 191 107)
- HSL
- hsl(66 40% 58%)
- HWB
- hwb(66 42% 25%)
- OKLCH
- oklch(0.78 0.108 113.4)
- OKLab
- oklab(0.78 -0.043 0.099)
- CIE Lab
- lab(75.31 -12.13 41.15)
- LCH
- lch(75.31 42.9 106.4)
- CMYK
- cmyk(4% 0% 44% 25%)
틴트 · 셰이드 · 톤
틴트
- BEC57B
- C5CC8A
- CCD299
- D3D9A8
- DADFB7
- E1E6C5
- E9ECD4
- F0F2E2
- F7F9F0
셰이드
- 9FA65C
- 878D4E
- 70753F
- 5A5E32
- 454825
- 313318
- 1E1F0D
- 0C0D04
- 020200
톤
- B1B96E
- ACB272
- A6AC74
- A0A677
- 9B9F79
- 95997B
- 90937C
- 8B8D7E
- 85867F
색 조화
보색 +180°
- B7BF6B
Avocado Cream
- BAAAF6
≈ Winterspring Lilac
유사색 -30° +30°
- B7BF6B
Avocado Cream
- D9B162
≈ Equator
- 8DC98A
≈ De York
삼각 배색 +120° +240°
- B7BF6B
Avocado Cream
- 6AC3F2
≈ Blue Mana
- EE9ABD
≈ Amaranth Pink
분열 보색 +150° +210°
- B7BF6B
Avocado Cream
- 93B7FD
≈ Carolina Blue
- D9A0DF
≈ Herb Robert
사각 배색 +90° +180° +270°
- B7BF6B
Avocado Cream
- 51CBD6
≈ Watercourse
- BAAAF6
≈ Winterspring Lilac
- F59B96
≈ Vinaceous
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.96:1 · APCA Lc 38
Ag
AAA검은색 위
WCAG 10.67:1 · APCA Lc 65
가장 좋은 글자색: #000000
WCAG 10.67:1 (AAA) · APCA Lc 65
Contrast pairs
코드 스니펫
CSS
:root {
--avocado-cream: #b7bf6b;
--avocado-cream-rgb: 183 191 107;
--avocado-cream-oklch: oklch(0.78 0.108 113.4);
}
.element {
color: var(--avocado-cream);
background-color: hsl(66 40% 58%);
border-color: oklch(0.78 0.108 113.4);
}Tailwind CSS v4
@theme {
--color-avocado-cream: #b7bf6b;
--color-avocado-cream-50: #f3fad7;
--color-avocado-cream-100: #e6edc4;
--color-avocado-cream-200: #d2daa6;
--color-avocado-cream-300: #b5bf7e;
--color-avocado-cream-400: #9ea557;
--color-avocado-cream-500: #868d2c;
--color-avocado-cream-600: #727827;
--color-avocado-cream-700: #5b601f;
--color-avocado-cream-800: #444613;
--color-avocado-cream-900: #2f300c;
--color-avocado-cream-950: #1b1c01;
}SCSS
$avocado-cream: #b7bf6b;
$avocado-cream-rgb: 183, 191, 107;
$avocado-cream-light: mix(#fff, $avocado-cream, 20%);
$avocado-cream-dark: mix(#000, $avocado-cream, 20%);
.element {
color: $avocado-cream;
box-shadow: 0 0 0 2px rgba($avocado-cream, 0.35);
}