Color 1 on Color 2
대비 샘플 텍스트
Text #D9D5D2onBG #796455
AA Large3.82:1큰 텍스트 AA 기준만 충족합니다.
팔레트 정보
Limestone Walnut Loft
추천 분야와 이유
- 프리미엄 패브릭 소파 상세페이지 — 라임스톤 그레이, 월넛 브라운, 차콜 조합이 패브릭 소파의 고급스러운 질감과 모던 거실 인테리어 이미지를 안정적으로 전달합니다. 온라인 가구몰 상세페이지에서 3인용 소파, 모듈 소파, 신혼집 인테리어 키워드와 잘 맞으며, 차분한 색감이 제품의 내구성과 편안한 착석감을 신뢰감 있게 보여줍니다.
- 남성 가죽 지갑 패키지 — 딥 차콜과 브라운 그레이가 남성 가죽 지갑, 카드지갑, 명함지갑 패키지에 필요한 클래식한 무게감과 실용적인 프리미엄 이미지를 만듭니다. 밝은 그레이 톤은 제품 사진을 깔끔하게 받쳐주며, 선물용 지갑, 직장인 액세서리, 가죽 소품 키워드에서 성숙하고 세련된 구매 인상을 강화합니다.
- 건축 자재 샘플북 표지 — 석재, 목재, 금속을 연상시키는 색상 구성이 인테리어 자재 샘플북, 마감재 카탈로그, 건축 자재 브랜딩에 적합합니다. 뉴트럴 컬러 중심이라 원목 마루, 콘크리트 타일, 알루미늄 프레임 같은 실제 소재와 조화롭고, 설계사무소와 시공업체 고객에게 전문적인 이미지를 전달합니다.
- 프리미엄 오피스 체어 상품 페이지 — 차콜 블랙과 쿨 그레이가 오피스 체어의 인체공학적 구조, 메쉬 소재, 업무용 가구 이미지를 명확하게 표현합니다. 브라운 베이지 포인트는 딱딱한 사무용품 느낌을 줄이고, 재택근무 의자, 허리 편한 의자, 고급 사무가구 키워드에서 안정적인 브랜드 신뢰도를 높입니다.
- 도자기 디너웨어 세트 패키지 — 밝은 그레이지와 베이지 그레이가 도자기 접시, 머그컵, 디너웨어 세트의 담백한 소재감을 돋보이게 합니다. 깊은 차콜은 고급 식기 패키지의 중심을 잡아주고, 브라운 톤은 따뜻한 식탁 이미지를 더해 집들이 선물, 신혼 식기세트, 감성 테이블웨어 키워드와 잘 연결됩니다.
비추천 분야와 이유
- 어린이 수영복 쇼핑몰 배너 — 어린이 수영복 배너는 밝은 블루, 옐로, 코랄처럼 물놀이의 즐거움과 활동성을 즉시 보여주는 색상이 중요합니다. 이 조합은 차분하고 성숙한 무드가 강해 키즈 래시가드, 아동 수영복, 여름 물놀이 용품 키워드에서 경쾌한 시즌감과 귀여운 이미지를 전달하기 어렵습니다.
- 딸기 요구르트 음료 패키지 — 딸기 요구르트 음료는 분홍색, 크림색, 신선한 과일 이미지를 통해 달콤함과 유산균 건강감을 빠르게 전달해야 합니다. 이 색상 구성은 석재와 가죽 같은 건조한 인상이 강해 딸기맛 요구르트, 유제품 패키지, 어린이 간식 음료 키워드에서 맛의 직관성과 식욕 자극이 부족합니다.
- 모바일 리듬게임 앱 아이콘 — 리듬게임 앱 아이콘은 강한 네온 컬러, 선명한 대비, 빠른 시선 집중이 핵심입니다. 이 팔레트는 저채도 중립색이 중심이라 모바일 게임 앱, 음악 게임, 리듬 액션 키워드에서 역동적인 사운드와 속도감을 표현하기 어렵고, 앱스토어 검색 결과에서 경쟁 아이콘보다 주목도가 낮아질 수 있습니다.
- 비타민 젤리 상세페이지 — 비타민 젤리는 오렌지, 레몬, 베리처럼 맛과 영양을 즉시 떠올리게 하는 밝은 색상이 필요합니다. 이 조합은 고급스럽지만 음식의 상큼함과 건강한 에너지를 강조하기에는 어둡고 차분해 비타민 구미, 어린이 영양 간식, 면역력 젤리 키워드에서 구매 욕구를 약하게 만들 수 있습니다.
- 초등 미술학원 전단지 — 초등 미술학원 전단지는 창의력, 색채 활동, 즐거운 수업 분위기를 보여주는 선명한 컬러가 중요합니다. 이 색감은 어른스러운 인테리어 톤에 가까워 아동 미술수업, 창의미술, 방과후 미술학원 키워드에서 활기와 친근함을 충분히 전달하지 못해 학부모와 아이의 관심을 끌기 어렵습니다.
팔레트가 주는 느낌
- 밝은 라임스톤 그레이와 차분한 월넛 브라운이 부드러운 생활감을 만들고, 거의 검정에 가까운 차콜이 구조적인 무게를 더합니다. 쿨 그레이와 베이지 그레이가 섞여 실내 건축 자재, 패브릭 소파, 금속 프레임이 놓인 모던 로프트가 떠오릅니다. 따뜻함과 차가움의 균형이 좋아 고급스럽고 정돈된 인상을 주며, 과장 없는 프리미엄 라이프스타일 분위기에 적합합니다.
WCAG 대비
팔레트 색상 간 대비
각 색상을 텍스트 색상으로, 나머지 색상을 배경색으로 보았을 때의 WCAG 대비율입니다. AA는 4.5:1 이상, AAA는 7:1 이상을 의미합니다.
Color 1
#D9D5D2와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 1 on Color 3
대비 샘플 텍스트
Text #D9D5D2onBG #1C1D1E
AAA11.58:1일반 텍스트 AAA 기준을 충족합니다.
Color 1 on Color 4
대비 샘플 텍스트
Text #D9D5D2onBG #B1B2BE
Fail1.44:1텍스트 대비 기준에 미달합니다.
Color 1 on Color 5
대비 샘플 텍스트
Text #D9D5D2onBG #AFA398
Fail1.69:1텍스트 대비 기준에 미달합니다.
Color 2
#796455와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 2 on Color 1
대비 샘플 텍스트
Text #796455onBG #D9D5D2
AA Large3.82:1큰 텍스트 AA 기준만 충족합니다.
Color 2 on Color 3
대비 샘플 텍스트
Text #796455onBG #1C1D1E
AA Large3.03:1큰 텍스트 AA 기준만 충족합니다.
Color 2 on Color 4
대비 샘플 텍스트
Text #796455onBG #B1B2BE
Fail2.65:1텍스트 대비 기준에 미달합니다.
Color 2 on Color 5
대비 샘플 텍스트
Text #796455onBG #AFA398
Fail2.26:1텍스트 대비 기준에 미달합니다.
Color 3
#1C1D1E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 3 on Color 1
대비 샘플 텍스트
Text #1C1D1EonBG #D9D5D2
AAA11.58:1일반 텍스트 AAA 기준을 충족합니다.
Color 3 on Color 2
대비 샘플 텍스트
Text #1C1D1EonBG #796455
AA Large3.03:1큰 텍스트 AA 기준만 충족합니다.
Color 3 on Color 4
대비 샘플 텍스트
Text #1C1D1EonBG #B1B2BE
AAA8.02:1일반 텍스트 AAA 기준을 충족합니다.
Color 3 on Color 5
대비 샘플 텍스트
Text #1C1D1EonBG #AFA398
AA6.85:1일반 텍스트 AA 기준을 충족합니다.
Color 4
#B1B2BE와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 4 on Color 1
대비 샘플 텍스트
Text #B1B2BEonBG #D9D5D2
Fail1.44:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 2
대비 샘플 텍스트
Text #B1B2BEonBG #796455
Fail2.65:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 3
대비 샘플 텍스트
Text #B1B2BEonBG #1C1D1E
AAA8.02:1일반 텍스트 AAA 기준을 충족합니다.
Color 4 on Color 5
대비 샘플 텍스트
Text #B1B2BEonBG #AFA398
Fail1.17:1텍스트 대비 기준에 미달합니다.
Color 5
#AFA398와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 5 on Color 1
대비 샘플 텍스트
Text #AFA398onBG #D9D5D2
Fail1.69:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 2
대비 샘플 텍스트
Text #AFA398onBG #796455
Fail2.26:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 3
대비 샘플 텍스트
Text #AFA398onBG #1C1D1E
AA6.85:1일반 텍스트 AA 기준을 충족합니다.
Color 5 on Color 4
대비 샘플 텍스트
Text #AFA398onBG #B1B2BE
Fail1.17:1텍스트 대비 기준에 미달합니다.
APCA 대비
인지 대비 기반 가독성 분석
APCA(Advanced Perceptual Contrast Algorithm)는 WCAG 2.0의 단순 대비율을 보완해 사람 눈이 느끼는 휘도, 밝은 배경·어두운 배경의 순응 상태, 텍스트 크기별 권장 용도를 함께 해석합니다.
핵심 계산 공식
어두운 글자 + 밝은 배경: Lc = ((Ybg^0.56 - Ytxt^0.57) × 1.14 - 0.027) × 100
밝은 글자 + 어두운 배경: Lc = ((Ybg^0.65 - Ytxt^0.62) × 1.14 + 0.027) × 100
Y 값은 RGB 채널에 2.4 TRC와 시각 가중치를 적용한 휘도이며, 저휘도 구간에는 soft clamp를 적용하고 ±0.1 미만의 낮은 대비는 0으로 클립합니다.
실무 적용 가이드
- |Lc| ≥ 90
- 매우 안정적인 본문/소형 텍스트에 적합합니다. 12px~14px 수준의 작은 텍스트, 얇은 글씨, 긴 본문처럼 오래 읽어야 하는 콘텐츠에 권장됩니다. 도움말, 약관, 설명문, 문서형 콘텐츠처럼 사용자가 정확히 읽어야 하는 텍스트라면 이 구간이 가장 안전합니다.
- |Lc| ≥ 75
- 일반 본문에 권장되는 안정적인 대비입니다. 16px 전후의 본문, 문단 텍스트, 주요 설명 텍스트에 적합합니다. 웹사이트 본문, 상품 설명, 서비스 소개문, 카드 설명문처럼 일반적인 콘텐츠 텍스트는 가능하면 이 기준 이상을 목표로 잡는 것이 좋습니다.
- |Lc| ≥ 60
- 짧은 UI 텍스트의 최소 권장 수준입니다. 버튼 라벨, 탭, 메뉴, 폼 라벨, 짧은 안내 문구처럼 빠르게 읽고 지나가는 텍스트에 사용할 수 있습니다. 다만 긴 본문 전체를 이 수준으로 구성하면 가독성이 부족할 수 있으므로, 본문에는 보수적으로 |Lc| 75 이상을 권장합니다.
- |Lc| ≥ 45
- 큰 글자, 굵은 글자, 아이콘에 제한적으로 사용할 수 있는 수준입니다. 24px 이상 굵은 제목, 36px 이상 일반 제목, 큰 버튼, 정보성 아이콘처럼 크기나 두께가 충분한 요소에 적합합니다. 작은 본문이나 중요한 안내 문구에는 부족할 수 있으므로 제한적으로 사용하는 것이 좋습니다.
- |Lc| ≥ 30
- 보조·비활성·플레이스홀더 수준입니다. placeholder, disabled text, 장식성 보조 텍스트처럼 중요도가 낮은 요소에만 사용하는 것이 좋습니다. 가격, 오류 메시지, 경고문, CTA 버튼처럼 사용자가 반드시 읽어야 하는 정보에는 권장하지 않습니다.
- |Lc| < 30
- 텍스트 용도로는 비추천합니다. 가독성이 낮기 때문에 본문, 버튼, 메뉴, 안내 문구에는 사용하지 않는 것이 좋습니다. 장식 배경, 구분선, 비핵심 그래픽처럼 읽을 필요가 없는 시각 요소에만 사용하는 것이 적절합니다.
Color 1
#D9D5D2와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #D9D5D2onBG #796455
|Lc| 45+-57 LcWCAG 3.82:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #D9D5D2onBG #1C1D1E
|Lc| 75+-80 LcWCAG 11.58:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #D9D5D2onBG #B1B2BE
|Lc| < 30-19 LcWCAG 1.44:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #D9D5D2onBG #AFA398
|Lc| < 30-27 LcWCAG 1.69:1
Color 2
#796455와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #796455onBG #D9D5D2
|Lc| 45++54 LcWCAG 3.82:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #796455onBG #1C1D1E
|Lc| < 30-22 LcWCAG 3.03:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #796455onBG #B1B2BE
|Lc| 30++35 LcWCAG 2.65:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #796455onBG #AFA398
|Lc| < 30+27 LcWCAG 2.26:1
Color 3
#1C1D1E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #1C1D1EonBG #D9D5D2
|Lc| 75++80 LcWCAG 11.58:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #1C1D1EonBG #796455
|Lc| < 30+24 LcWCAG 3.03:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #1C1D1EonBG #B1B2BE
|Lc| 60++61 LcWCAG 8.02:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #1C1D1EonBG #AFA398
|Lc| 45++53 LcWCAG 6.85:1
Color 4
#B1B2BE와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #B1B2BEonBG #D9D5D2
|Lc| < 30+17 LcWCAG 1.44:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #B1B2BEonBG #796455
|Lc| 30+-36 LcWCAG 2.65:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #B1B2BEonBG #1C1D1E
|Lc| 45+-59 LcWCAG 8.02:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #B1B2BEonBG #AFA398
|Lc| < 30+0 LcWCAG 1.17:1
Color 5
#AFA398와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #AFA398onBG #D9D5D2
|Lc| < 30+24 LcWCAG 1.69:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #AFA398onBG #796455
|Lc| < 30-29 LcWCAG 2.26:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #AFA398onBG #1C1D1E
|Lc| 45+-52 LcWCAG 6.85:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #AFA398onBG #B1B2BE
|Lc| < 30+0 LcWCAG 1.17:1
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
More Palettes
다른 색상 팔레트도 둘러보기
현재 보고 있는 팔레트를 제외하고 랜덤으로 고른 4개의 팔레트입니다. 새로운 배색 아이디어가 필요할 때 함께 비교해 보세요.