컬러 팔레트 이미지 내보내기
관련 외부 사이트
일부 링크는 제휴 링크입니다.
관련 도구
이미지 색상 추출기이미지를 업로드하지 않고 브라우저에서 주요 색상 팔레트를 추출합니다. 각 색상의 HEX, RGB와 비율(%)을 확인하고 CSS/JSON으로 내보내세요.배색 생성기기준 HEX에서 보색·유사색·트라이어드 등 조화로운 컬러 팔레트를 자동 생성. 색상을 잠그고 나머지를 재생성하며 CSS 변수·Tailwind·JSON으로 내보내기.색상 변환HEX·RGB·HSL·HSV·RGBA를 한 화면에서 상호 변환. 값 하나만 바꿔도 전부 연동, 원클릭 복사, 투명도·WCAG 대비 지원.그라데이션 생성기여러 색상 정지점으로 선형·방사형·원뿔형 CSS 그라데이션을 만드세요. 각도·형태·중심을 조정하고 background CSS 또는 Tailwind 값을 원클릭으로 복사.
HEX 색상으로 컬러 팔레트를 만들고 각 색상의 HEX 라벨이 포함된 깔끔한 PNG 이미지로 내보낼 수 있습니다. 팔레트 공유, Figma에 붙여넣기, SNS 게시에 최적입니다. 모든 생성이 브라우저에서 이루어지며 업로드되지 않습니다.
사용 방법
- 색상 선택기 또는 HEX 입력란으로 색상을 추가·편집·삭제합니다.
- 스와치 이미지의 실시간 미리보기를 확인합니다.
- 팔레트를 PNG로 다운로드합니다.
작동 원리
각 색상이 캔버스에 나란히 스와치로 그려지고 HEX 코드가 아래에 표시됩니다. 라벨 색상(검정 또는 흰색)은 스와치 밝기에 따라 자동으로 선택되어 항상 읽기 쉽게 유지됩니다. 그 캔버스가 PNG 이미지로 내보내집니다.
기능
색상 추가 및 편집
색상 선택기 또는 HEX 코드 직접 입력으로 원하는 만큼 추가·삭제할 수 있습니다.
HEX 라벨
각 스와치에 HEX 코드가 표시되어 팔레트 자체가 설명이 됩니다.
읽기 쉬운 라벨
스와치 밝기에 따라 라벨 텍스트 색상이 검정과 흰색 사이에서 자동 전환됩니다.
PNG 내보내기
공유나 가져오기에 바로 사용할 수 있는 고해상도 이미지를 다운로드합니다.
활용 사례
팔레트 공유
선택한 색상 이미지를 팀원이나 클라이언트에게 전달합니다.
Figma에 붙여넣기
디자인 파일에 팔레트 이미지를 참조용으로 붙여넣습니다.
SNS 게시
색상 구성을 보여주는 깔끔한 팔레트 이미지를 SNS에 올립니다.
브랜드 가이드
간단한 브랜드 시트에 라벨이 붙은 스와치 이미지를 포함합니다.
참고 사항
- 색상은 HEX로 입력하며 3자리 또는 6자리 HEX를 지원합니다.
- 내보낸 PNG는 투명하지 않은 단색 배경을 가집니다.
- 스와치는 한 줄로 배치됩니다.
- 모든 처리는 기기에서 실행되며 업로드되지 않습니다.
자주 묻는 질문
- 어떤 색상 형식을 사용할 수 있나요?
- 3자리(#abc) 또는 6자리(#aabbcc) HEX 코드를 사용할 수 있습니다. 색상 선택기도 자동으로 HEX를 입력해 줍니다.
- 색상을 몇 개나 추가할 수 있나요?
- 원하는 만큼 추가할 수 있습니다. 스와치가 늘어날수록 이미지 너비가 자동으로 늘어납니다.
- PNG가 투명한가요?
- 아니요. 각 스와치는 해당 영역을 채우는 단색이므로 이미지에 투명 영역이 없습니다.
- 이미지를 상업적으로 사용할 수 있나요?
- 네. 이미지는 단순히 여러분의 색상을 스와치로 렌더링한 것이므로 여기서 만든 것은 여러분 것입니다.
- 데이터가 서버로 전송되나요?
- 아니요. 팔레트 이미지는 브라우저에서 완전히 생성됩니다.