이미지 색상 추출기 – 사진 색감 채도 명도 분석 | 모두의 변환기

모두의 변환기이미지 색상 추출기
🎨 이미지 색상 추출기 사진의 색감·채도·명도·무드를 분석하고 HEX 팔레트 코드를 추출해요
🎨 팔레트 추출 👁️ 채도·명도 분석 🌟 무드 자동 판단 🔒 서버 전송 없음 🖱️ 픽셀 색상 피커 📋 CSS 코드 내보내기
📷 이미지 업로드
업로드된 이미지
🖱️ 이미지를 클릭하면 해당 픽셀 색상을 추출해요
#000000
rgb(0,0,0)
📷 사진을 클릭하거나 드래그하세요 JPG · PNG · WebP · GIF 지원 · 파일이 서버로 전송되지 않습니다
🌟 색감 분석 결과
🎨 색상 분석 중…
🌟 이미지 무드
평균 채도
평균 명도
따뜻함/차가움
📈 색상 비율 (클릭하면 HEX 복사)
🎨 주요 색상 팔레트 (클릭하면 HEX 복사)
📋 코드로 내보내기
☀️ 색상 조화 제안 (도미넌트 컬러 기준)
👁️ 색상 이론 — 채도·명도·색조·무드란? 이미지의 색감을 이해하면 더 효과적인 디자인·사진·브랜딩이 가능해요. HSL 색상 모델로 색을 분석하면 색의 본질을 파악할 수 있어요.
🎨 색조 (Hue)
색의 종류. 빨강·노랑·파랑 등 색상환의 위치를 0~360°로 표현
0°/360° = 빨강, 60° = 노랑, 120° = 초록, 240° = 파랑
따뜻한 색(빨강·노랑): 0~60°, 차가운 색(파랑): 180~270°
✨ 채도 (Saturation)
색의 선명함. 0% = 무채색(회색), 100% = 가장 선명한 색
인스타 감성 사진은 채도 30~60%의 부드러운 톤이 많음
채도 80%+ = 강렬하고 활기찬 느낌
💡 명도 (Lightness)
색의 밝고 어두운 정도. 0% = 검정, 100% = 흰색
파스텔 톤: 명도 70%+, 채도 40% 이하
다크 무드: 명도 30% 이하, 채도는 다양
🌡️ 색온도 (따뜻함/차가움)
따뜻한 색: 빨강·주황·노랑 계열 → 에너지, 활기, 친근함
차가운 색: 파랑·보라·청록 계열 → 차분, 신뢰, 전문성
브랜딩에서 색온도는 감성 전달에 핵심 역할
💡 색상 팔레트 추출 활용 가이드 디자인 참고용: 마음에 드는 사진의 색감을 팔레트로 추출해서 Figma·Canva·Photoshop에 HEX 코드 그대로 입력하면 동일한 분위기의 디자인을 만들 수 있어요. 브랜드 컬러 설정: 브랜드 이미지나 제품 사진에서 팔레트를 추출해 공식 컬러 가이드라인을 만들 수 있어요. 블로그·SNS 썸네일: 여러 게시물의 색감을 통일하면 피드가 훨씬 세련되어 보여요. 도미넌트 컬러를 배경색으로 활용해보세요. 개발자 활용: CSS 변수 내보내기 기능으로 추출한 팔레트를 바로 코드에 적용할 수 있어요.
❓ 자주 묻는 질문
Q. 색상을 몇 개까지 추출할 수 있나요? 기본 8가지 주요 색상을 추출해요. Median Cut 알고리즘으로 이미지에서 가장 대표적인 색상들을 선별해서 보여줘요. 색상 비율 바에서 각 색상이 차지하는 면적 비율도 확인할 수 있어요.
Q. 픽셀 색상 피커는 어떻게 사용하나요? 이미지 업로드 후 이미지를 클릭하면 해당 위치의 픽셀 색상이 표시돼요. HEX 코드와 RGB 값을 바로 복사할 수 있어요. 특정 색상을 정확히 추출하고 싶을 때 유용해요.
Q. 인스타 감성 사진의 색감 특징은? 인스타그램에서 인기 있는 사진들은 대체로 채도 30~60%, 명도 45~70%의 부드러운 톤이에요. 따뜻한 베이지·크림·테라코타 계열이나 차가운 파스텔 블루·세이지 그린 계열이 많아요. 이 도구로 마음에 드는 인스타 사진을 분석해보세요.
Q. 추출한 HEX 코드를 어디에 활용하나요? Figma·Canva·Photoshop — HEX 코드 직접 입력 ② 블로그 CSS — CSS 변수 내보내기 기능 활용 ③ HTML — color:#XXXXXX 형식으로 사용 ④ 미리캔버스 — 색상 코드 직접 입력 가능
Q. 파일이 서버로 전송되나요? 전혀 전송되지 않아요. 이미지 분석은 브라우저의 Canvas API를 사용해 기기 안에서만 처리돼요. 개인 사진, 중요 이미지도 안전하게 분석할 수 있어요.
Q. 보색·유사색이란 무엇인가요? 보색은 색상환에서 정반대에 위치한 색으로, 함께 사용하면 강렬한 대비 효과가 나요. 유사색은 색상환에서 인접한 색으로, 조화롭고 자연스러운 배색이에요. 삼각 배색은 120° 간격의 세 색상으로, 균형 잡힌 다채로운 느낌이에요.
Q. 무드(분위기) 판단은 어떻게 하나요? 평균 채도·명도·색온도를 종합 분석해서 이미지의 분위기를 자동으로 판단해요. 예: 채도 낮고 명도 높으면 "파스텔·청순", 따뜻한 계열이면 "따뜻하고 감성적", 어둡고 채도 높으면 "강렬하고 드라마틱"으로 분류해요.