이름 색상 · #AFB1C5
Noble Purple
Noble Purple은(는) #AFB1C5: rgb(175 177 197), hsl(235 16% 73%), oklch(0.765 0.028 281.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Noble Purple color name →
#AFB1C5
oklch(0.765 0.028 281.2)
색상 변환
- HEX
- #afb1c5
- RGB
- rgb(175 177 197)
- HSL
- hsl(235 16% 73%)
- HWB
- hwb(235 69% 23%)
- OKLCH
- oklch(0.765 0.028 281.2)
- OKLab
- oklab(0.765 0.006 -0.028)
- CIE Lab
- lab(72.52 2.25 -10.46)
- LCH
- lch(72.52 10.7 282.1)
- CMYK
- cmyk(11% 10% 0% 23%)
틴트 · 셰이드 · 톤
틴트
- B7B9CB
- BFC0D0
- C6C8D6
- CED0DC
- D6D7E2
- DEDFE8
- E6E7ED
- EFEFF3
- F7F7F9
셰이드
- 9899AB
- 818392
- 6B6C79
- 565761
- 41424B
- 2E2F35
- 1C1C21
- 0B0C0E
- 010102
톤
- AAACBE
- A5A7B7
- A1A2B0
- 9C9DA9
- 9798A2
- 92939B
- 8E8E94
- 898A8D
- 858587
색 조화
보색 +180°
- AFB1C5
Noble Purple
- B6B49F
≈ Turtle Trail
유사색 -30° +30°
- AFB1C5
Noble Purple
- A6B4C5
≈ Suds
- B9AEC0
≈ Courtly Purple
삼각 배색 +120° +240°
- AFB1C5
Noble Purple
- C4ADA5
≈ Glamorous Taupe
- A4B9AD
≈ Silt Green
분열 보색 +150° +210°
- AFB1C5
Noble Purple
- BFB0A0
≈ Discover
- ACB7A4
≈ Stormy Day
사각 배색 +90° +180° +270°
- AFB1C5
Noble Purple
- C4ACAE
≈ Pale Lychee
- B6B49F
≈ Turtle Trail
- 9FB9B7
≈ Gin Berry
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.11:1 · APCA Lc 42
Ag
AAA검은색 위
WCAG 9.91:1 · APCA Lc 61
가장 좋은 글자색: #000000
WCAG 9.91:1 (AAA) · APCA Lc 61
Contrast pairs
코드 스니펫
CSS
:root {
--noble-purple: #afb1c5;
--noble-purple-rgb: 175 177 197;
--noble-purple-oklch: oklch(0.765 0.028 281.2);
}
.element {
color: var(--noble-purple);
background-color: hsl(235 16% 73%);
border-color: oklch(0.765 0.028 281.2);
}Tailwind CSS v4
@theme {
--color-noble-purple: #afb1c5;
--color-noble-purple-50: #f4f4fd;
--color-noble-purple-100: #e6e7f1;
--color-noble-purple-200: #d2d3e0;
--color-noble-purple-300: #b5b6c6;
--color-noble-purple-400: #9b9daf;
--color-noble-purple-500: #828499;
--color-noble-purple-600: #6e7081;
--color-noble-purple-700: #585a68;
--color-noble-purple-800: #40424c;
--color-noble-purple-900: #2c2d35;
--color-noble-purple-950: #191a20;
}SCSS
$noble-purple: #afb1c5;
$noble-purple-rgb: 175, 177, 197;
$noble-purple-light: mix(#fff, $noble-purple, 20%);
$noble-purple-dark: mix(#000, $noble-purple, 20%);
.element {
color: $noble-purple;
box-shadow: 0 0 0 2px rgba($noble-purple, 0.35);
}