이름 색상 · #A1CCB1
Calculus
Calculus은(는) #A1CCB1: rgb(161 204 177), hsl(142 30% 72%), oklch(0.807 0.059 157.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Green mean? → · Calculus color name →
#A1CCB1
oklch(0.807 0.059 157.2)
색상 변환
- HEX
- #a1ccb1
- RGB
- rgb(161 204 177)
- HSL
- hsl(142 30% 72%)
- HWB
- hwb(142 63% 20%)
- OKLCH
- oklch(0.807 0.059 157.2)
- OKLab
- oklab(0.807 -0.055 0.023)
- CIE Lab
- lab(78.39 -18.79 8.63)
- LCH
- lch(78.39 20.67 155.3)
- CMYK
- cmyk(21% 0% 13% 20%)
틴트 · 셰이드 · 톤
틴트
- AAD1B9
- B4D6C0
- BDDBC8
- C7E0D0
- D0E5D7
- D9EBDF
- E3F0E7
- ECF5EF
- F6FAF7
셰이드
- 8BB199
- 769783
- 627E6C
- 4E6557
- 3C4E42
- 2A372F
- 19221C
- 090F0C
- 010201
톤
- 9EC4AC
- 9BBCA7
- 98B5A2
- 94AD9D
- 91A598
- 8E9E93
- 8A968E
- 878F8A
- 838785
색 조화
보색 +180°
- A1CCB1
Calculus
- DAB2CE
≈ Purple Poodle
유사색 -30° +30°
- A1CCB1
Calculus
- B5C89F
≈ Wasabi Peanut
- 94CDC6
≈ Jamaica Bay
삼각 배색 +120° +240°
- A1CCB1
Calculus
- B6BDE7
≈ Spoiled Rotten
- E3B3A5
≈ Terra Cotta Blush
분열 보색 +150° +210°
- A1CCB1
Calculus
- CAB6DE
≈ Viking Diva
- E3B1B9
≈ Amazon River Dolphin
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.78:1 · APCA Lc 33
Ag
AAA검은색 위
WCAG 11.78:1 · APCA Lc 70
가장 좋은 글자색: #000000
WCAG 11.78:1 (AAA) · APCA Lc 70
Contrast pairs
코드 스니펫
CSS
:root {
--calculus: #a1ccb1;
--calculus-rgb: 161 204 177;
--calculus-oklch: oklch(0.807 0.059 157.2);
}
.element {
color: var(--calculus);
background-color: hsl(142 30% 72%);
border-color: oklch(0.807 0.059 157.2);
}Tailwind CSS v4
@theme {
--color-calculus: #a1ccb1;
--color-calculus-50: #e8fbef;
--color-calculus-100: #d8eee1;
--color-calculus-200: #c0dccb;
--color-calculus-300: #9ec1ad;
--color-calculus-400: #82a991;
--color-calculus-500: #659277;
--color-calculus-600: #567c65;
--color-calculus-700: #446350;
--color-calculus-800: #324939;
--color-calculus-900: #223227;
--color-calculus-950: #111e15;
}SCSS
$calculus: #a1ccb1;
$calculus-rgb: 161, 204, 177;
$calculus-light: mix(#fff, $calculus, 20%);
$calculus-dark: mix(#000, $calculus, 20%);
.element {
color: $calculus;
box-shadow: 0 0 0 2px rgba($calculus, 0.35);
}