Color 1 on Color 2
대비 샘플 텍스트
Text #C28315onBG #5C3E2E
AA Large3.00:1큰 텍스트 AA 기준만 충족합니다.
Palette Detail
Cozy Autumn
추천 분야와 이유
- F&B(식음료) 브랜드 및 카페 인테리어 — 커피와 디저트를 연상시키는 깊은 브라운과 부드러운 크림색이 식욕과 아늑함을 자극합니다. 여기에 화사한 옐로우가 포인트로 더해져 트렌디하고 감각적인 브랜드 이미지를 구축하기에 완벽합니다.
- 가을/겨울 시즌 패션 및 뷰티 패키지 — 묵직한 대지(흙)의 색감과 따스한 햇살 같은 노란빛의 조화가 고급스러우면서도 포근한 계절감을 전합니다. 가을·겨울 컬렉션의 룩북이나 웰빙, 오가닉 콘셉트의 뷰티 브랜드에 잘 어울립니다.
- 빈티지 가구 및 라이프스타일 굿즈 — 고급스러운 고가구 느낌의 짙은 우드 톤과 클래식한 황동 조명을 닮은 옐로우의 매칭이 세련된 레트로 감성을 자아냅니다. 아늑한 분위기를 지향하는 소품이나 독립 서점 등의 굿즈 디자인에 추천합니다.
- 독립출판물 디자인 및 에세이 표지 — 차분하고 깊이 있는 브라운과 크림색이 텍스트에 대한 몰입도를 높이고 마음을 진정시키는 효과를 줍니다. 선명한 옐로우를 타이포그래피나 띠지에 포인트로 사용하면, 감성적이면서도 시선을 사로잡는 흡입력 있는 표지가 완성됩니다.
- 가죽 공방 및 아날로그 가젯 브랜드 BI — 시간이 흐를수록 멋이 우러나는 천연 가죽과 에이징된 황동 부자재를 직관적으로 연상시키는 컬러 조합입니다. 클래식한 장인 정신과 수공예적 가치를 진정성 있게 전달하고 싶을 때 시각적 신뢰감을 극대화해 줍니다.
비추천 분야와 이유
- 첨단 IT / AI 및 테크 기업 BI — 브라운과 크림색이 주는 따뜻함과 아날로그적인 감성은 최첨단, 신속성, 디지털 혁신을 강조해야 하는 테크 기업이나 SaaS(서비스형 소프트웨어) 랜딩페이지에는 자칫 고리타분하거나 속도가 느리다는 인상을 줄 수 있으므로 비추천합니다.
- 스포츠 및 아웃도어 액티비티 브랜드 — 시각적인 편안함과 묵직한 안정감이 중심인 배색이기 때문에, 폭발적인 에너지와 역동적인 생동감을 전달해야 하는 스포츠 웨어, 익스트림 스포츠 플랫폼 등에는 타겟의 아드레날린을 자극하기 부족합니다.
- 의료, 제약 및 위생 용품 웹사이트 — 브라운 계열의 색상은 오가닉한 느낌을 주지만, 의료 서비스에서 가장 중요한 '무결점의 청결함'이나 '차가울 정도의 위생적인 신뢰감'을 표현하기에는 부적절할 수 있습니다. 깨끗한 화이트와 블루 계열을 대체재로 추천합니다.
팔레트가 주는 느낌
- 묵직한 브라운 톤들이 전체적인 중심을 잡아주어 깊이감과 신뢰감을 선사하고, 부드러운 크림색(#F4F2E9)이 그 사이를 유연하게 채워주며 시각적인 편안함을 매끄럽게 유도합니다. 자칫 무겁고 진지하게만 흘러갈 수 있는 분위기를 톡 쏘는 레몬 옐로우(#FAD10C)가 위트 있게 깨뜨리며 신선하고 생동감 넘치는 활력을 더해줍니다.
WCAG Contrast
팔레트 색상 간 대비
각 색상을 텍스트 색상으로, 나머지 색상을 배경색으로 보았을 때의 WCAG 대비율입니다. AA는 4.5:1 이상, AAA는 7:1 이상을 의미합니다.
Color 1
#C28315와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 1 on Color 3
대비 샘플 텍스트
Text #C28315onBG #F4F2E9
Fail2.86:1텍스트 대비 기준에 미달합니다.
Color 1 on Color 4
대비 샘플 텍스트
Text #C28315onBG #FAD10C
Fail2.17:1텍스트 대비 기준에 미달합니다.
Color 1 on Color 5
대비 샘플 텍스트
Text #C28315onBG #864914
Fail2.20:1텍스트 대비 기준에 미달합니다.
Color 2
#5C3E2E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 2 on Color 1
대비 샘플 텍스트
Text #5C3E2EonBG #C28315
AA Large3.00:1큰 텍스트 AA 기준만 충족합니다.
Color 2 on Color 3
대비 샘플 텍스트
Text #5C3E2EonBG #F4F2E9
AAA8.58:1일반 텍스트 AAA 기준을 충족합니다.
Color 2 on Color 4
대비 샘플 텍스트
Text #5C3E2EonBG #FAD10C
AA6.50:1일반 텍스트 AA 기준을 충족합니다.
Color 2 on Color 5
대비 샘플 텍스트
Text #5C3E2EonBG #864914
Fail1.36:1텍스트 대비 기준에 미달합니다.
Color 3
#F4F2E9와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 3 on Color 1
대비 샘플 텍스트
Text #F4F2E9onBG #C28315
Fail2.86:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 2
대비 샘플 텍스트
Text #F4F2E9onBG #5C3E2E
AAA8.58:1일반 텍스트 AAA 기준을 충족합니다.
Color 3 on Color 4
대비 샘플 텍스트
Text #F4F2E9onBG #FAD10C
Fail1.32:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 5
대비 샘플 텍스트
Text #F4F2E9onBG #864914
AA6.29:1일반 텍스트 AA 기준을 충족합니다.
Color 4
#FAD10C와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 4 on Color 1
대비 샘플 텍스트
Text #FAD10ConBG #C28315
Fail2.17:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 2
대비 샘플 텍스트
Text #FAD10ConBG #5C3E2E
AA6.50:1일반 텍스트 AA 기준을 충족합니다.
Color 4 on Color 3
대비 샘플 텍스트
Text #FAD10ConBG #F4F2E9
Fail1.32:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 5
대비 샘플 텍스트
Text #FAD10ConBG #864914
AA4.77:1일반 텍스트 AA 기준을 충족합니다.
Color 5
#864914와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 5 on Color 1
대비 샘플 텍스트
Text #864914onBG #C28315
Fail2.20:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 2
대비 샘플 텍스트
Text #864914onBG #5C3E2E
Fail1.36:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 3
대비 샘플 텍스트
Text #864914onBG #F4F2E9
AA6.29:1일반 텍스트 AA 기준을 충족합니다.
Color 5 on Color 4
대비 샘플 텍스트
Text #864914onBG #FAD10C
AA4.77:1일반 텍스트 AA 기준을 충족합니다.
APCA Contrast
인지 대비 기반 가독성 분석
APCA(Advanced Perceptual Contrast Algorithm)는 WCAG 2.0의 단순 대비율을 보완해 사람 눈이 느끼는 휘도, 밝은 배경·어두운 배경의 순응 상태, 텍스트 크기별 권장 용도를 함께 해석합니다.
핵심 계산 공식
어두운 글자 + 밝은 배경: Lc = (Ybg^0.56 - Ytxt^0.57) × 161.8
밝은 글자 + 어두운 배경: Lc = (Ybg^0.62 - Ytxt^0.65) × 161.8
Y 값은 RGB 채널을 시각 가중치로 변환한 휘도이며, 161.8은 결과를 약 -105~+105 범위의 사람이 읽기 쉬운 점수로 맞추는 스케일 상수입니다.
실무 적용 가이드
- Lc 90 이상
- 12px 수준의 작은 본문도 안정적
- Lc 75 이상
- 14px~16px 일반 본문 권장
- Lc 60 이상
- 굵은 글씨·24px 이상 타이틀 권장
- Lc 45 이상
- 큰 버튼·부가 정보에 제한 활용
Color 1
#C28315와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C28315onBG #5C3E2E
Low Lc-42 LcWCAG 3.00:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #C28315onBG #F4F2E9
Lc 60++73 LcWCAG 2.86:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #C28315onBG #FAD10C
Lc 45++50 LcWCAG 2.17:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C28315onBG #864914
Low Lc-32 LcWCAG 2.20:1
Color 2
#5C3E2E와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #5C3E2EonBG #C28315
Lc 45++47 LcWCAG 3.00:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #5C3E2EonBG #F4F2E9
Lc 90++119 LcWCAG 8.58:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #5C3E2EonBG #FAD10C
Lc 90++96 LcWCAG 6.50:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #5C3E2EonBG #864914
Low Lc+12 LcWCAG 1.36:1
Color 3
#F4F2E9와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #F4F2E9onBG #C28315
Lc 75+-76 LcWCAG 2.86:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #F4F2E9onBG #5C3E2E
Lc 90+-122 LcWCAG 8.58:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #F4F2E9onBG #FAD10C
Low Lc-25 LcWCAG 1.32:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #F4F2E9onBG #864914
Lc 90+-111 LcWCAG 6.29:1
Color 4
#FAD10C와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #FAD10ConBG #C28315
Lc 45+-50 LcWCAG 2.17:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #FAD10ConBG #5C3E2E
Lc 90+-95 LcWCAG 6.50:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #FAD10ConBG #F4F2E9
Low Lc+24 LcWCAG 1.32:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #FAD10ConBG #864914
Lc 75+-85 LcWCAG 4.77:1
Color 5
#864914와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #864914onBG #C28315
Low Lc+36 LcWCAG 2.20:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #864914onBG #5C3E2E
Low Lc-8 LcWCAG 1.36:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #864914onBG #F4F2E9
Lc 90++108 LcWCAG 6.29:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #864914onBG #FAD10C
Lc 75++85 LcWCAG 4.77:1
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
More Palettes
다른 색상 팔레트도 둘러보기
현재 보고 있는 팔레트를 제외하고 랜덤으로 고른 4개의 팔레트입니다. 새로운 배색 아이디어가 필요할 때 함께 비교해 보세요.