색상 관찰 노트

라벤더
#e6e6fa

선택한 색상 · sRGB#e6e6fa

숫자로 알아보는 색 · RGB / HSL / OKLCH

HEX: #e6e6fa
RGB: rgb(230, 230, 250)
HSL: hsl(240, 66.67%, 94.12%)
OKLCH: oklch(0.93090233 0.02694143 285.864799)

이 색은 어떤 특징이 있나요?

빨강과 초록이 같고 파랑 채널이 조금 더 높은 옅은 색입니다. 작은 견본이 일부 화면에서 흰색처럼 보여도 중립적인 흰색은 아닙니다.

이 HEX에는 CSS 키워드 이름도 있습니다.

함께할 때 더 좋은 색.

보색

HSL 색상환에서 180° 떨어진 두 색입니다. 서로 선명한 대비를 이룹니다.

#e6e6fa#fafae6

유사색

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

#e6f0fa#e6e6fa#f0e6fa

삼각 조합

0°, 120°, 240°로 색상환을 세 등분한 조합입니다.

#e6e6fa#fae6e6#e6fae6

실제 디자인 사용 예시

읽기 메모, 선택한 패널, 차분한 발표 구간의 배경에 활용해 보세요. 또 다른 파스텔 글자보다 네이비 제목이 위계를 더 뚜렷하게 만들 수 있습니다.

디자인 조언은 맥락에 따라 달라지는 제안이며 수치 계산과 구분합니다.

사용하기 전에 확인할 점

라벤더와 흰색의 차이만으로 입력란이나 선택 상태를 알리기에는 부족할 수 있습니다. 테두리, 이름, 색 이외의 단서를 함께 제공하세요.

읽기 편한 색을 찾으세요. / CSS

대비율 · #e6e6fa
선택한 색상	대비율	일반 텍스트 · AA
검정	17.06:1	통과
흰색	1.23:1	기준 미달

CSS 사용 예시

.color-surface {
  background: #e6e6fa;
  color: #000000;
}

질문과 직접적인 답변

#e6e6fa의 색상값은 무엇인가요?

#e6e6fa는 rgb(230, 230, 250), hsl(240, 66.67%, 94.12%), oklch(0.93090233 0.02694143 285.864799)입니다. 모두 같은 불투명 sRGB 색상에서 계산한 값입니다.

#e6e6fa 배경에서는 어떤 글자색이 더 읽기 쉬운가요?

검정의 대비율은 17.06:1, 흰색은 1.23:1입니다. 두 색 중 검정의 대비가 더 높습니다. 일반 텍스트 AA 기준은 4.5:1 이상입니다.

보색 팔레트는 어떻게 계산하나요?

HSL 색상각을 180° 회전하고 채도와 명도를 유지합니다. 이 색의 결과는 #e6e6fa, #fafae6입니다. 무채색은 그대로 무채색으로 남습니다.

흰 바탕의 본문 글자색으로 라벤더를 써도 되나요?

옅은 배경용 색이 곧 글자색으로도 적합한 것은 아닙니다. 아래 라벤더·흰색 대비를 확인하고, 본문에는 기준을 충족하는 더 어두운 글자색을 선택하세요.

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

02 / 어울리는 색

함께할 때 더 좋은 색.

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

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

01조합색

#e6f0fargb(230, 240, 250)oklch(0.95055246 0.01721226 248.008865)

대비율: 18.21:1

02기준색

#e6e6fargb(230, 230, 250)oklch(0.93090233 0.02694143 285.864799)

대비율: 17.06:1

03조합색

#f0e6fargb(240, 230, 250)oklch(0.93867721 0.02869168 308.121742)

대비율: 17.40:1

HSL / 유사색

색상 정보·고급 도구

선택한 색상 / #E6E6FA

숫자로 알아보는 색

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

HEX

#e6e6fa

RGB

rgb(230, 230, 250)

HSL

hsl(240, 66.67%, 94.12%)

OKLCH

oklch(0.93090233 0.02694143 285.864799)

색상각: 240.00°
채도: 66.67%
명도: 94.12%

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

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

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

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

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

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

현재 팔레트

보정 결과 미리보기

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

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

원래 HSL 조합과 비교

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

#e6f0faoklch(0.95055246 0.01721226 248.008865)#e6e6faoklch(0.93090233 0.02694143 285.864799)#f0e6faoklch(0.93867721 0.02869168 308.121742)

팔레트 CSS

:root {
  --palette-1: #e6f0fa;
  --palette-2: #e6e6fa;
  --palette-3: #f0e6fa;
}

디자인 미리보기

03 / 디자인에 적용

디자인에 적용해 보세요.

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

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

적용된 글자색 조합 #000000 / #e6e6fa · 17.06:1

your-next-idea.design

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

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

새로운 시선을 담을 공간.

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

컬렉션 살펴보기

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

#f0e6fa / #e6e6fa · 1.02:1 · 일반 텍스트 · AA

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

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

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

텍스트 대비 검사

접근성 / WCAG AA

읽기 편한 색을 찾으세요.

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

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

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

색상 탐색으로 돌아가기

라벤더#e6e6fa

이 색은 어떤 특징이 있나요?

보색

유사색

삼각 조합

실제 디자인 사용 예시

사용하기 전에 확인할 점

CSS 사용 예시

질문과 직접적인 답변

관련 색상

함께할 때 더 좋은 색.

숫자로 알아보는 색

디자인에 적용해 보세요.

새로운 시선을 담을 공간.

읽기 편한 색을 찾으세요.

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

라벤더
#e6e6fa