PALUNEXA / 조합 스튜디오

조합 스튜디오

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

02 / 어울리는 색

함께할 때 더 좋은 색.

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

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

01조합색

#d84d74rgb(216, 77, 116)oklch(0.61863331 0.17597389 6.703117)

대비율: 5.23:1

02기준색

#d86b4drgb(216, 107, 77)oklch(0.65065789 0.14420776 36.33236)

대비율: 6.13:1

03조합색

#d8b14drgb(216, 177, 77)oklch(0.77642304 0.12567114 87.691283)

대비율: 10.32:1

HSL / 유사색

색상 정보·고급 도구

선택한 색상 / #D86B4D

숫자로 알아보는 색

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

HEX

#d86b4d

RGB

rgb(216, 107, 77)

HSL

hsl(12.95, 64.06%, 57.45%)

OKLCH

oklch(0.65065789 0.14420776 36.33236)

색상각: 12.95°
채도: 64.06%
명도: 57.45%

이 조합을 어디에 쓰면 좋을까요?

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

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

OKLCH · 지각적 명도와 채도 보정

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

OKLCH 명도 조절 0%OKLCH 채도 배율 100%

현재 팔레트

보정 결과 미리보기

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

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

원래 HSL 조합과 비교

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

#d84d74oklch(0.61863331 0.17597389 6.703117)#d86b4doklch(0.65065789 0.14420776 36.33236)#d8b14doklch(0.77642304 0.12567114 87.691283)

팔레트 CSS

:root {
  --palette-1: #d84d74;
  --palette-2: #d86b4d;
  --palette-3: #d8b14d;
}

디자인 미리보기

03 / 디자인에 적용

디자인에 적용해 보세요.

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

팔레트 역할 지정주 색상 / 배경팔레트 글자색 / 강조색

적용된 글자색 조합 #000000 / #d86b4d · 6.13:1

your-next-idea.design

FORM & FIELD자유로운 생각, 세심하게 고른 색.

일상을 위한 아이디어 스튜디오

새로운 시선을 담을 공간.

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

컬렉션 살펴보기

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

#d8b14d / #d86b4d · 1.68:1 · 일반 텍스트 · AA

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

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

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

텍스트 대비 검사

접근성 / WCAG AA

읽기 편한 색을 찾으세요.

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