Color 1 on Color 2
대비 샘플 텍스트
Text #283716onBG #CBC7AC
AAA7.46:1일반 텍스트 AAA 기준을 충족합니다.
팔레트 정보
Muted Matcha
추천 분야와 이유
- 유기농 세이지 에센셜 오일 스킨케어 패키지 — 천연 원료의 순수함을 강조해야 하는 비건 뷰티 분야에 최적화된 조합입니다. 인공 색소를 배제하고 대지의 생명력을 담은 유기농 기초 화장품 용기나 단상자 패키지에 적용할 경우, 소비자에게 시각적으로 깊은 신뢰감을 줍니다. 차분한 그린과 베이지 조합은 화학 성분이 없는 무독성 식물성 성분의 아이덴티티를 명확하게 각인시키며 친환경 브랜드 이미지 구축에 기여합니다.
- 원목 가구 전문 쇼핑몰 상세페이지 및 웹사이트 — 비오필릭(Biophilic) 디자인과 유기적 미니멀리즘 인테리어를 지향하는 이커머스 플랫폼에 적합합니다. 가구의 나무 질감이나 린넨 패브릭 소재와 시각적 충돌 없이 고급스럽게 어우러지며, 화면을 장시간 보아도 눈이 피로하지 않은 인터페이스를 제공합니다. 자연 친화적 가구 디자인의 고급스러운 감성을 강조하고 구매 전환율을 높이는 안정적인 분위기를 형성합니다.
- 자연주의 스파 및 요가 센터 멤버십 카드 — 신체적, 정신적 치유와 휴식을 제공하는 웰니스 산업 부문의 프리미엄 오프라인 굿즈로 훌륭한 선택입니다. 차분하게 톤 다운된 카키와 올리브 톤은 심박수를 안정시키고 내면의 평화를 유도하는 시각적 효과가 있습니다. 멤버십 카드나 리플릿 등의 지류 인쇄물에 무광 텍스처와 함께 사용하면 대접받는 듯한 차별화된 아늑함과 럭셔리한 웰니스 감성을 확실하게 전달합니다.
- 프리미엄 친환경 허브티 선물 세트 패키지 — 식음료 분야 중에서도 자연의 치유력을 강조하는 가공식품 유통에 유용합니다. 말린 약초나 차 잎사귀를 연상시키는 고유의 내추럴 색상들이 패키지 디자인에 적용되면 제품의 풍미와 아로마 향을 시각적으로 먼저 체감하게 만드는 효과가 있습니다. 명절이나 기념일을 겨냥한 고급 선물 세트 가치를 높여주며, 환경을 생각하는 지속 가능한 포장재와도 시각적 결합도가 우수합니다.
- 지속 가능한 지속 가능 패션 브랜드 lookbook 웹사이트 — 에코 프렌들리 섬유와 천연 염색을 사용하는 패션 브랜드의 온라인 카탈로그에 부합합니다. 화려한 원색 대신 어스 톤의 색감들이 배경과 폰트에 배치되면 의류 본연의 텍스처와 정교한 마감 처리에 시선이 집중되도록 돕습니다. 유행을 타지 않는 타임리스 패션 철학을 웹 브랜딩 전면에 노출하여, 진정성 있는 브랜드 스토리를 전달하고자 하는 타깃층에 깊은 인상을 남깁니다.
비추천 분야와 이유
- 어린이 전용 키즈 카페 웹사이트 — 성장기 어린이들의 창의력과 활기찬 에너지를 자극해야 하는 키즈 마케팅 및 플랫폼 디자인에는 적합하지 않습니다. 차분하고 묵직한 이끼와 대지의 색감들은 역동적이고 신나는 놀이 공간의 이미지를 반감시키며, 자칫 아이들에게 지루하거나 어두운 공간이라는 인상을 심어줄 수 있습니다. 회전율이 높고 활기찬 분위기가 필수적인 플랫폼 특성과 시각적 대조를 이룹니다.
- 고성능 게이밍 마우스 및 키보드 패키지 — 첨단 기술력과 빠른 반응 속도, 미래지향적인 아이덴티티를 직관적으로 보여주어야 하는 하드웨어 전자기기 분야에는 부적합합니다. 기기의 날렵함과 화려한 RGB LED 조명 효과를 돋보이게 하려면 강렬한 대비나 메탈릭한 컬러가 요구되나, 이 정적인 자연의 색들은 전자기기의 역동적인 기계적 성능을 오히려 둔탁하고 느려 보이게 만드는 역효과를 낼 수 있습니다.
- 도심형 공유 전동 킥보드 대여 모바일 앱 — 야외 및 도심 도로 환경에서 높은 시인성을 확보하고 신속한 조작을 유도해야 하는 모빌리티 서비스 앱에는 치명적입니다. 회색 아스팔트나 도심 가로수 배경과 색상이 동화되어 앱 화면의 시각적 인지도를 떨어뜨릴 위험이 크며, 즉각적인 안전 확보와 빠른 UI 조작을 방해할 수 있습니다. 경고나 탑승 가능 표시 등 가시성이 중요한 모바일 환경에는 명도가 너무 낮습니다.
- 탄산음료 및 에너지 드링크 알루미늄 캔 디자인 — 목 넘김의 청량감과 즉각적인 활력 충전을 구매 포인트로 내세우는 음료 시장에서는 기피해야 할 구성입니다. 차분하고 정적인 카키와 세이지 톤은 음료의 시원함이나 톡 쏘는 탄산의 탄력감을 전달하기 어렵고, 오히려 정체되어 있거나 미지근한 한약재 같은 묵직한 인상을 줍니다. 즉각적인 갈증 해소를 시각적으로 차단하여 식음료 셀링 포인트를 흐리게 만듭니다.
- 인공지능 기반 핀테크 자산관리 플랫폼 — 혁신적인 인공지능 기술력과 초단위로 변하는 금융 데이터의 스마트함을 강조해야 하는 금융 앱 비즈니스에는 어울리지 않습니다. 금융 플랫폼은 차가운 메탈릭 톤이나 신뢰감을 주는 블루 계열이 주로 사용되는데 반해, 대지의 따스함과 아날로그 감성이 강한 이 색상들은 디지털 기술의 최첨단 이미지나 신속한 금융 자산 처리 속도감을 표현하기에 다소 정체된 느낌을 줍니다.
팔레트가 주는 느낌
- 깊은 숲의 이끼와 세이지 잎사귀를 닮은 카키, 올리브 그린 계열(#283716, #596631, #8C9062, #A3AC7E)과 부드러운 린넨 베이지 톤(#CBC7AC)이 조화를 이루는 프리미엄 어스 톤(Earth Tone) 조합입니다. 자연 친화적이면서도 차분하게 톤 다운된 색감은 시각적 자극을 최소화하여 심리적 안정감과 깊이 있는 클래식함을 전달합니다. 인위적인 느낌을 배제한 내추럴 톤의 구성으로, 오랜 시간 머무르고 싶은 아늑함과 정제된 웰빙(Well-being) 감성을 직관적으로 자극하는 무게감 있는 분위기를 형성합니다.
WCAG 대비
팔레트 색상 간 대비
각 색상을 텍스트 색상으로, 나머지 색상을 배경색으로 보았을 때의 WCAG 대비율입니다. AA는 4.5:1 이상, AAA는 7:1 이상을 의미합니다.
Color 1
#283716와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 1 on Color 3
대비 샘플 텍스트
Text #283716onBG #8C9062
AA Large3.81:1큰 텍스트 AA 기준만 충족합니다.
Color 1 on Color 4
대비 샘플 텍스트
Text #283716onBG #596631
Fail2.04:1텍스트 대비 기준에 미달합니다.
Color 1 on Color 5
대비 샘플 텍스트
Text #283716onBG #A3AC7E
AA5.31:1일반 텍스트 AA 기준을 충족합니다.
Color 2
#CBC7AC와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 2 on Color 1
대비 샘플 텍스트
Text #CBC7AConBG #283716
AAA7.46:1일반 텍스트 AAA 기준을 충족합니다.
Color 2 on Color 3
대비 샘플 텍스트
Text #CBC7AConBG #8C9062
Fail1.96:1텍스트 대비 기준에 미달합니다.
Color 2 on Color 4
대비 샘플 텍스트
Text #CBC7AConBG #596631
AA Large3.65:1큰 텍스트 AA 기준만 충족합니다.
Color 2 on Color 5
대비 샘플 텍스트
Text #CBC7AConBG #A3AC7E
Fail1.40:1텍스트 대비 기준에 미달합니다.
Color 3
#8C9062와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 3 on Color 1
대비 샘플 텍스트
Text #8C9062onBG #283716
AA Large3.81:1큰 텍스트 AA 기준만 충족합니다.
Color 3 on Color 2
대비 샘플 텍스트
Text #8C9062onBG #CBC7AC
Fail1.96:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 4
대비 샘플 텍스트
Text #8C9062onBG #596631
Fail1.86:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 5
대비 샘플 텍스트
Text #8C9062onBG #A3AC7E
Fail1.39:1텍스트 대비 기준에 미달합니다.
Color 4
#596631와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 4 on Color 1
대비 샘플 텍스트
Text #596631onBG #283716
Fail2.04:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 2
대비 샘플 텍스트
Text #596631onBG #CBC7AC
AA Large3.65:1큰 텍스트 AA 기준만 충족합니다.
Color 4 on Color 3
대비 샘플 텍스트
Text #596631onBG #8C9062
Fail1.86:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 5
대비 샘플 텍스트
Text #596631onBG #A3AC7E
Fail2.60:1텍스트 대비 기준에 미달합니다.
Color 5
#A3AC7E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 5 on Color 1
대비 샘플 텍스트
Text #A3AC7EonBG #283716
AA5.31:1일반 텍스트 AA 기준을 충족합니다.
Color 5 on Color 2
대비 샘플 텍스트
Text #A3AC7EonBG #CBC7AC
Fail1.40:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 3
대비 샘플 텍스트
Text #A3AC7EonBG #8C9062
Fail1.39:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 4
대비 샘플 텍스트
Text #A3AC7EonBG #596631
Fail2.60: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
#283716와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #283716onBG #CBC7AC
|Lc| 60++66 LcWCAG 7.46:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #283716onBG #8C9062
|Lc| 30++36 LcWCAG 3.81:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #283716onBG #596631
|Lc| < 30+16 LcWCAG 2.04:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #283716onBG #A3AC7E
|Lc| 45++49 LcWCAG 5.31:1
Color 2
#CBC7AC와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #CBC7AConBG #283716
|Lc| 60+-66 LcWCAG 7.46:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #CBC7AConBG #8C9062
|Lc| 30+-31 LcWCAG 1.96:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #CBC7AConBG #596631
|Lc| 45+-50 LcWCAG 3.65:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #CBC7AConBG #A3AC7E
|Lc| < 30-16 LcWCAG 1.40:1
Color 3
#8C9062와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #8C9062onBG #283716
|Lc| 30+-35 LcWCAG 3.81:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #8C9062onBG #CBC7AC
|Lc| < 30+28 LcWCAG 1.96:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #8C9062onBG #596631
|Lc| < 30-19 LcWCAG 1.86:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #8C9062onBG #A3AC7E
|Lc| < 30+12 LcWCAG 1.39:1
Color 4
#596631와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #596631onBG #283716
|Lc| < 30-15 LcWCAG 2.04:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #596631onBG #CBC7AC
|Lc| 45++48 LcWCAG 3.65:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #596631onBG #8C9062
|Lc| < 30+18 LcWCAG 1.86:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #596631onBG #A3AC7E
|Lc| 30++32 LcWCAG 2.60:1
Color 5
#A3AC7E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #A3AC7EonBG #283716
|Lc| 45+-49 LcWCAG 5.31:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #A3AC7EonBG #CBC7AC
|Lc| < 30+14 LcWCAG 1.40:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #A3AC7EonBG #8C9062
|Lc| < 30-13 LcWCAG 1.39:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #A3AC7EonBG #596631
|Lc| 30+-33 LcWCAG 2.60:1
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
More Palettes
다른 색상 팔레트도 둘러보기
현재 보고 있는 팔레트를 제외하고 랜덤으로 고른 4개의 팔레트입니다. 새로운 배색 아이디어가 필요할 때 함께 비교해 보세요.