PixelVault의 색상 및 이미지 분석기는 어떤 이미지에서든 팔레트, 히스토그램, 대비 정보를 전적으로 브라우저에서 추출합니다. 사진, 일러스트, 스크린샷을 넣으면 주요 색상을 복사 가능한 헥스 코드로, 각 색상이 차지하는 비율과 함께 즉시 얻을 수 있습니다. 아무것도 설치하거나 파일을 업로드하지 않고 마음에 드는 이미지에서 팔레트를 뽑는 빠른 방법입니다.
주요 색상에서 보색, 유사색, 삼각형, 단색 조화를 생성해 일관된 배색을 만들고, 팔레트 전체를 순수 HEX, CSS 변수, SCSS 변수, JSON, Tailwind 설정으로 내보내 프로젝트에 바로 붙여넣을 수 있습니다. 더 깊은 분석을 위해 RGB와 휘도 히스토그램이 노출과 톤 균형을 드러내고, 흑백 미리보기가 색 없이 이미지가 어떻게 보이는지 보여주며, WCAG 대비 검사기가 텍스트와 배경 조합이 접근성을 위한 AA와 AAA를 통과하는지 알려줍니다.
작동 방식
PixelVault는 이미지를 낮은 해상도로 샘플링하고 유사한 색상을 묶어 주요 색상을 찾고, 색 공간 간 변환으로 조화를 만들며, 픽셀 값을 읽어 히스토그램을 계산합니다. 대비 비율은 WCAG 2.1 상대 휘도 공식을 사용합니다. 이 모든 것이 이미 브라우저에 로드된 픽셀에서 실행됩니다.
로컬 처리가 중요한 이유
로컬 분석은 고객 작업, 미공개 디자인, 사적인 사진 같은 이미지를 네트워크에 올리지 않습니다. 업로드도, 사본을 보관할 서버도 없으며, 픽셀이 이미 페이지에 있으므로 결과가 즉각적입니다.
지원 형식
- JPG — 직접 분석됨.
- PNG — 색상을 샘플링할 때 투명도가 존중됨.
- WebP — 완전히 지원됨.
일반적인 사용 사례
- 사진이나 디자인 참고 자료에서 색상 팔레트를 추출하세요.
- 브랜드나 UI를 위한 어울리는 배색을 생성하세요.
- 접근성을 위해 텍스트와 배경의 대비를 확인하세요.
- RGB와 휘도 히스토그램으로 노출과 톤을 살펴보세요.