Color 1 on Color 2
대비 샘플 텍스트
Text #C0DAEEonBG #3D4C44
AA6.26:1일반 텍스트 AA 기준을 충족합니다.
Palette Detail
Lake Pine Cabin
추천 분야와 이유
- 캠핑용 방수 재킷 — 스카이 블루와 블루 그레이는 방수 재킷, 등산 재킷, 캠핑 의류의 시원하고 기능적인 이미지를 잘 보여 줍니다. 짙은 그린과 올리브 톤은 숲, 트레킹, 백패킹 키워드와 자연스럽게 연결됩니다. 야외 활동용 제품이지만 과하게 스포츠처럼 보이지 않아 감성 캠핑룩 상세 페이지에 적합합니다.
- 북유럽 원목 침실 협탁 — 차분한 그린과 회갈색은 원목 협탁, 침실 가구, 북유럽 인테리어 소품에 안정적인 분위기를 더합니다. 연한 블루는 침실 공간을 답답하지 않게 만들고, 전체 색감이 린넨 침구나 무광 세라믹 조명과 잘 어울립니다. 자연 소재 가구, 미니멀 침실, 감성 홈스타일링 키워드에 적합합니다.
- 친환경 샴푸바 패키지 — 올리브 그린과 짙은 그린은 친환경 샴푸바, 비건 뷰티, 플라스틱 프리 제품의 자연 유래 이미지를 전달하기 좋습니다. 연한 블루는 깨끗한 세정감과 산뜻한 사용감을 보완합니다. 천연 성분, 제로웨이스트 욕실용품, 민감성 두피 케어 같은 SEO 키워드와도 잘 맞습니다.
- 호수 근처 펜션 예약 페이지 — 스카이 블루와 블루 그레이는 호수, 계곡, 숲속 숙소 예약 페이지에서 맑고 조용한 휴식 이미지를 만듭니다. 그린 계열은 자연 풍경과 숙소 외관 사진을 자연스럽게 받쳐 줍니다. 감성 펜션, 숲속 숙소, 힐링 여행, 주말 여행 키워드를 차분하고 신뢰감 있게 표현하기 좋습니다.
- 명상용 아로마 캔들 — 부드러운 블루와 그린 계열은 아로마 캔들, 명상 캔들, 수면 루틴 제품에 필요한 안정감과 깨끗한 공기감을 줍니다. 회갈색은 유리 용기, 우드 심지, 크라프트 패키지와 잘 어울립니다. 라벤더, 유칼립투스, 편백 향처럼 숲과 휴식을 강조하는 캔들 디자인에 적합합니다.
비추천 분야와 이유
- 매운 떡볶이 밀키트 패키지 — 매운 떡볶이 밀키트는 빨강, 주황, 검정처럼 강한 식욕과 매운맛을 즉각적으로 전달하는 색이 중요합니다. 이 색 조합은 숲과 물, 차분한 휴식을 먼저 떠올리게 하므로 불맛 떡볶이, 매운 소스, 분식 밀키트 키워드의 자극적인 맛 표현이 약해질 수 있습니다.
- 어린이 생일파티 초대장 — 어린이 생일파티 초대장은 밝은 원색, 귀여운 캐릭터, 풍선과 케이크처럼 즐거운 이미지를 강하게 보여 주어야 합니다. 이 팔레트는 차분한 자연색과 흐린 블루 중심이라 키즈 파티, 유아 생일, 돌잔치 초대장에 필요한 경쾌함과 축하 분위기가 부족해 보일 수 있습니다.
- 럭셔리 립스틱 광고 배너 — 립스틱 광고 배너는 발색, 광택, 피부 톤, 메이크업 포인트가 선명하게 드러나야 합니다. 이 색상들은 자연스럽고 차분하지만 레드 립스틱, 글로시 립, 고발색 메이크업 키워드와 연결되는 화려함이 약합니다. 뷰티 프로모션에서는 제품 컬러의 존재감이 흐려질 수 있습니다.
- e스포츠 팀 유니폼 — e스포츠 팀 유니폼은 강한 대비, 빠른 속도감, 팀 아이덴티티, 경기장 조명 아래의 주목도가 중요합니다. 이 조합은 차분한 아웃도어와 인테리어 이미지는 좋지만 게이밍 유니폼, 프로게임단 굿즈, 스트리밍 썸네일에서 필요한 공격적 에너지와 시각적 임팩트가 부족합니다.
- 탄산 에너지 드링크 캔 — 에너지 드링크 캔은 강한 각성감, 탄산감, 카페인, 운동 전 부스터 이미지를 빠르게 전달해야 합니다. 이 팔레트는 차갑고 안정적인 자연 무드가 강해 파워풀한 에너지 음료, 편의점 신제품, 스포츠 드링크 패키지에서 즉각적인 자극과 속도감을 만들기 어렵습니다.
팔레트가 주는 느낌
- 연한 스카이 블루가 맑은 공기와 물빛을 만들고, 짙은 그린과 올리브 톤이 숲의 깊이를 더하는 팔레트입니다. 회갈색과 블루 그레이가 함께 들어가 자연 소재, 젖은 돌, 흐린 호수, 산장 인테리어가 떠오릅니다. 전체적으로 차갑지만 날카롭지 않고, 차분하지만 답답하지 않습니다. 아웃도어 감성, 북유럽 인테리어, 친환경 브랜드, 조용한 휴식 이미지를 전달하기 좋습니다.
WCAG Contrast
팔레트 색상 간 대비
각 색상을 텍스트 색상으로, 나머지 색상을 배경색으로 보았을 때의 WCAG 대비율입니다. AA는 4.5:1 이상, AAA는 7:1 이상을 의미합니다.
Color 1
#C0DAEE와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 1 on Color 3
대비 샘플 텍스트
Text #C0DAEEonBG #788061
Fail2.87:1텍스트 대비 기준에 미달합니다.
Color 1 on Color 4
대비 샘플 텍스트
Text #C0DAEEonBG #645C59
AA4.51:1일반 텍스트 AA 기준을 충족합니다.
Color 1 on Color 5
대비 샘플 텍스트
Text #C0DAEEonBG #718999
Fail2.53:1텍스트 대비 기준에 미달합니다.
Color 2
#3D4C44와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 2 on Color 1
대비 샘플 텍스트
Text #3D4C44onBG #C0DAEE
AA6.26:1일반 텍스트 AA 기준을 충족합니다.
Color 2 on Color 3
대비 샘플 텍스트
Text #3D4C44onBG #788061
Fail2.18:1텍스트 대비 기준에 미달합니다.
Color 2 on Color 4
대비 샘플 텍스트
Text #3D4C44onBG #645C59
Fail1.39:1텍스트 대비 기준에 미달합니다.
Color 2 on Color 5
대비 샘플 텍스트
Text #3D4C44onBG #718999
Fail2.48:1텍스트 대비 기준에 미달합니다.
Color 3
#788061와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 3 on Color 1
대비 샘플 텍스트
Text #788061onBG #C0DAEE
Fail2.87:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 2
대비 샘플 텍스트
Text #788061onBG #3D4C44
Fail2.18:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 4
대비 샘플 텍스트
Text #788061onBG #645C59
Fail1.57:1텍스트 대비 기준에 미달합니다.
Color 3 on Color 5
대비 샘플 텍스트
Text #788061onBG #718999
Fail1.13:1텍스트 대비 기준에 미달합니다.
Color 4
#645C59와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 4 on Color 1
대비 샘플 텍스트
Text #645C59onBG #C0DAEE
AA4.51:1일반 텍스트 AA 기준을 충족합니다.
Color 4 on Color 2
대비 샘플 텍스트
Text #645C59onBG #3D4C44
Fail1.39:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 3
대비 샘플 텍스트
Text #645C59onBG #788061
Fail1.57:1텍스트 대비 기준에 미달합니다.
Color 4 on Color 5
대비 샘플 텍스트
Text #645C59onBG #718999
Fail1.78:1텍스트 대비 기준에 미달합니다.
Color 5
#718999와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
Color 5 on Color 1
대비 샘플 텍스트
Text #718999onBG #C0DAEE
Fail2.53:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 2
대비 샘플 텍스트
Text #718999onBG #3D4C44
Fail2.48:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 3
대비 샘플 텍스트
Text #718999onBG #788061
Fail1.13:1텍스트 대비 기준에 미달합니다.
Color 5 on Color 4
대비 샘플 텍스트
Text #718999onBG #645C59
Fail1.78:1텍스트 대비 기준에 미달합니다.
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
#C0DAEE와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C0DAEEonBG #3D4C44
Lc 90+-95 LcWCAG 6.26:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C0DAEEonBG #788061
Lc 60+-65 LcWCAG 2.87:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C0DAEEonBG #645C59
Lc 75+-84 LcWCAG 4.51:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #C0DAEEonBG #718999
Lc 45+-59 LcWCAG 2.53:1
Color 2
#3D4C44와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #3D4C44onBG #C0DAEE
Lc 90++96 LcWCAG 6.26:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #3D4C44onBG #788061
Low Lc+32 LcWCAG 2.18:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #3D4C44onBG #645C59
Low Lc+13 LcWCAG 1.39:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #3D4C44onBG #718999
Low Lc+38 LcWCAG 2.48:1
Color 3
#788061와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #788061onBG #C0DAEE
Lc 60++65 LcWCAG 2.87:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #788061onBG #3D4C44
Low Lc-27 LcWCAG 2.18:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #788061onBG #645C59
Low Lc-16 LcWCAG 1.57:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #788061onBG #718999
Low Lc+7 LcWCAG 1.13:1
Color 4
#645C59와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #645C59onBG #C0DAEE
Lc 75++84 LcWCAG 4.51:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #645C59onBG #3D4C44
Low Lc-9 LcWCAG 1.39:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #645C59onBG #788061
Low Lc+20 LcWCAG 1.57:1
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #645C59onBG #718999
Low Lc+26 LcWCAG 1.78:1
Color 5
#718999와 다른 색상의 대비
나머지 4개 배경색과 비교합니다.
APCA sample · 어두운 글자 + 밝은 배경
인지 대비 샘플
Text #718999onBG #C0DAEE
Lc 45++59 LcWCAG 2.53:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #718999onBG #3D4C44
Low Lc-34 LcWCAG 2.48:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #718999onBG #788061
Low Lc-3 LcWCAG 1.13:1
APCA sample · 밝은 글자 + 어두운 배경
인지 대비 샘플
Text #718999onBG #645C59
Low Lc-22 LcWCAG 1.78:1
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
색상 코드 상세
css
tailwind
More Palettes
다른 색상 팔레트도 둘러보기
현재 보고 있는 팔레트를 제외하고 랜덤으로 고른 4개의 팔레트입니다. 새로운 배색 아이디어가 필요할 때 함께 비교해 보세요.