PALUNEXA
색상 탐색으로 돌아가기

색상 관찰 노트

자세히 들여다보기
#a2b6cb

색상 이름 또는 HEX·RGB·HSL·OKLCH를 입력하세요. 가입 없이 사용할 수 있습니다.

선택한 색상 · sRGB#a2b6cb
숫자로 알아보는 색 · RGB / HSL / OKLCH
HEX
#a2b6cb
RGB
rgb(162, 182, 203)
HSL
hsl(210.73, 28.28%, 71.57%)
OKLCH
oklch(0.76783723 0.03740288 249.60645)

#a2b6cb 색상이 포함된 팔레트

이 색상이 들어간 조합을 확인하세요. Studio에서는 선택한 색상의 잠금을 유지합니다.

마음에 드는 팔레트를 골라 색을 복사하거나 Studio에서 편집해 보세요.

큐레이션 제안

하늘빛 엽서

파스텔

Studio에서 편집

설명과 대비

옅은 파랑을 여행 사진과 짧은 설명을 받치는 여백에 씁니다.

추천 활용: 웹사이트 · 편집 디자인

권장 색상 역할

배경
#f0f5fc
카드
#d5e3f4
강조
#a2b6cb
버튼
#f0f5fc
텍스트
#29394f

텍스트 / 배경: 10.70:1 · 일반 텍스트 AA 충족

텍스트 / 카드: 9.00:1 · 일반 텍스트 AA 충족

텍스트 / 버튼: 10.70:1 · 일반 텍스트 AA 충족

텍스트와 배경의 조합마다 대비를 확인하세요. 팔레트 색상은 자동으로 바꾸지 않습니다.

선택한 색상을 잠급니다. Studio의 기준색은 팔레트 첫색입니다.

디자인 활용 사례

대표 색상으로 만든 정적 디자인 사례입니다. 가까운 색은 같은 참고 사례를 안내하지만, 팔레트를 바꿔도 이미지가 재색칠되지는 않습니다.

자동 생성 팔레트

사각 조합 · #a2b6cb

Studio에서 편집

설명과 대비

기존 HSL 조화 엔진으로 계산한 조합입니다. 큐레이션 제안과 구분합니다.

권장 색상 역할

배경
#a2b6cb
카드
#b7a2cb
강조
#cbb7a2
버튼
#a2b6cb
텍스트
#b6cba2

텍스트 / 배경: 1.19:1 · AA 미달 · 대안 #000000

텍스트 / 카드: 1.33:1 · AA 미달 · 대안 #000000

텍스트 / 버튼: 1.19:1 · AA 미달 · 대안 #000000

텍스트와 배경의 조합마다 대비를 확인하세요. 팔레트 색상은 자동으로 바꾸지 않습니다.

선택한 색상을 잠급니다. Studio의 기준색은 팔레트 첫색입니다.

디자인 활용 사례

대표 색상으로 만든 정적 디자인 사례입니다. 가까운 색은 같은 참고 사례를 안내하지만, 팔레트를 바꿔도 이미지가 재색칠되지는 않습니다.

자동 생성 팔레트

정사각 조합 · #a2b6cb

Studio에서 편집

설명과 대비

기존 HSL 조화 엔진으로 계산한 조합입니다. 큐레이션 제안과 구분합니다.

권장 색상 역할

배경
#a2b6cb
카드
#cba2ca
강조
#cbb7a2
버튼
#a2b6cb
텍스트
#a2cba3

텍스트 / 배경: 1.15:1 · AA 미달 · 대안 #000000

텍스트 / 카드: 1.21:1 · AA 미달 · 대안 #000000

텍스트 / 버튼: 1.15:1 · AA 미달 · 대안 #000000

텍스트와 배경의 조합마다 대비를 확인하세요. 팔레트 색상은 자동으로 바꾸지 않습니다.

선택한 색상을 잠급니다. Studio의 기준색은 팔레트 첫색입니다.

디자인 활용 사례

대표 색상으로 만든 정적 디자인 사례입니다. 가까운 색은 같은 참고 사례를 안내하지만, 팔레트를 바꿔도 이미지가 재색칠되지는 않습니다.

이 색으로 조합 스튜디오 열기

02 / 어울리는 색

함께할 때 더 좋은 색.

색상환의 원리에 따라 어울리는 조합을 찾아보세요.

#a2b6cb

기준색은 유지합니다. 잠긴 색과 기준색은 재생성·보정으로 바뀌지 않습니다.

팔레트 CSS 내보내기

기준색을 중심으로 −30°, 0°, +30°에 있는 이웃 색입니다.

01조합색
#a2cacbrgb(162, 202, 203)oklch(0.81060578 0.04234259 198.238002)
대비율: 11.85:1
02기준색
#a2b6cbrgb(162, 182, 203)oklch(0.76783723 0.03740288 249.60645)
대비율: 10.09:1
03조합색
#a3a2cbrgb(163, 162, 203)oklch(0.72725566 0.05905884 285.949467)
대비율: 8.59:1
HSL / 유사색
색상 정보·고급 도구

선택한 색상 / #A2B6CB

숫자로 알아보는 색

하나의 색을 네 가지 방식으로 표현합니다.

HEX
#a2b6cb
RGB
rgb(162, 182, 203)
HSL
hsl(210.73, 28.28%, 71.57%)
OKLCH
oklch(0.76783723 0.03740288 249.60645)
색상각
210.73°
채도
28.28%
명도
71.57%
이 조합을 어디에 쓰면 좋을까요?

아래 사용 제안은 주관적인 디자인 조언입니다. 색상각과 대비율은 계산한 값입니다.

추천 사용 목적
편집형 페이지, 생활용품 브랜드, 차분한 화면.
장점
이웃한 색상각이 비슷한 분위기를 이어줍니다.
주의사항
경계가 흐려질 수 있으니 글자와 중립적인 여백으로 구분하세요.
디자인 적용 예시
가운데 색을 대표 영역에, 이웃 색을 장식 카드에 사용해 보세요.
OKLCH · 지각적 명도와 채도 보정

잠기지 않은 조합색의 명도와 채도를 OKLCH에서 조절합니다. HSL 색상각 간격이 달라질 수 있습니다. 결과를 비교한 뒤 적용하세요.

현재 팔레트
보정 결과 미리보기

sRGB 색역에 맞춰 채도를 줄인 색: 0개

기준색은 유지합니다. 잠긴 색과 기준색은 재생성·보정으로 바뀌지 않습니다.

원래 HSL 조합과 비교

편집하지 않은 이론 조합입니다. 위 팔레트의 HEX·OKLCH 값과 비교해 보세요.

#a2cacboklch(0.81060578 0.04234259 198.238002)#a2b6cboklch(0.76783723 0.03740288 249.60645)#a3a2cboklch(0.72725566 0.05905884 285.949467)
팔레트 CSS
:root {
  --palette-1: #a2cacb;
  --palette-2: #a2b6cb;
  --palette-3: #a3a2cb;
}
디자인 미리보기

03 / 디자인에 적용

디자인에 적용해 보세요.

실제 CSS로 선택한 색을 미리 확인합니다.

팔레트 역할 지정

적용된 글자색 조합 #000000 / #a2b6cb · 10.09:1

your-next-idea.design
FORM & FIELD자유로운 생각, 세심하게 고른 색.
일상을 위한 아이디어 스튜디오

새로운 시선을 담을 공간.

작은 호기심에서 일상의 새로운 아이디어가 시작됩니다.

컬렉션 살펴보기

팔레트의 글자색·배경색이 일반 텍스트 AA 기준에 미달합니다.

#a3a2cb / #a2b6cb · 1.17:1 · 일반 텍스트 · AA

대체 글자색: #000000 (대비율 10.09:1).

화면에 적용된 글자 대비율: 10.09:1 · 접근 가능한 글자색은 미리보기에만 적용합니다. 팔레트는 바뀌지 않습니다.

검사한 색상 쌍은 색이 있는 버튼·카드·지표·슬라이드 띠에 적용합니다. 나머지 글자는 #f6f3ec 위 #262a23(대비율 13.18:1) 또는 #55594f(6.47:1)를 사용합니다. 차트는 번호로도 구분합니다. 접근성 전체 검사 결과는 아닙니다.

디자인 활용 사례

대표 색상으로 만든 정적 디자인 사례입니다. 가까운 색은 같은 참고 사례를 안내하지만, 팔레트를 바꿔도 이미지가 재색칠되지는 않습니다.

텍스트 대비 검사

접근성 / WCAG AA

읽기 편한 색을 찾으세요.

선택한 색과 글자색 또는 배경색의 대비를 확인하세요.

추천 글자색: #000000 · 21.00:1

AA 기준은 일반 텍스트 4.5:1, 큰 텍스트 3:1입니다. 색상 대비 검사이며 WCAG 전체 적합성 판정은 아닙니다.

Aa

색은 선명하게, 글자는 읽기 쉽게.

#a2b6cb / #ffffff
대비율2.08:1
  • 일반 텍스트 · AA기준 미달
  • 큰 텍스트 · AA기준 미달
  • 일반 텍스트 · AAA기준 미달
  • 큰 텍스트 · AAA기준 미달

색을 조합하는 간단한 원리.

PALUNEXA는 HSL 색상환에서 색상각을 회전하고 채도와 명도를 유지합니다. 단색 조합은 명도를 바꿉니다. 계산으로 얻은 조합은 디자인의 출발점이며, 모든 사람에게 같은 미적 만족을 보장하지는 않습니다.

색상 탐색으로 돌아가기