도구95

멋진 결과물을 만들어 보세요

이미지 색상 추출기.

이미지에서 HEX, RGB 및 HSL 색상을 추출하세요. 팔레트를 추출 및 편집하고, 텍스트 대비를 확인한 다음 색상을 복사하거나 PNG, SVG, CSS 또는 JSON로 내보내세요.

광고
이미지 작업 공간
임시 서버 처리
또는 여기에 드래그 앤 드롭
JPG, JPEG, PNG, WEBP, GIF, BMP, TIF, TIFF, HEIC, HEIF
시작하려면 이미지를 선택하세요.이미지
광고
블로그 이미지 색상을 선택하고 팔레트를 만드는 방법 가이드 읽기

이미지 색상을 선택하고 사용할 팔레트를 만드세요

픽셀을 검사하고 HEX, RGB 또는 HSL 값을 복사하며 사진에서 시작 팔레트를 추출하세요. 마음에 드는 색상은 유지하고 나머지는 편집하며, 텍스트와 배경 쌍을 확인하고 PNG, SVG, CSS 또는 JSON를 내보내세요.

이미지는 개별 색상 샘플과 다듬고 내보낼 수 있는 팔레트를 제공합니다.
빠른 동영상 튜토리얼 How to pick an image color and export a palette Upload an image, inspect a pixel with the magnifier, add its color to the extracted palette, select Start and download a PNG palette. 영어 내레이션 동영상 보기

How to pick an image color and export a palette

기능 및 제어

확대 보기로 픽셀 선택

이미지를 클릭하거나 탭하여 색상을 검사한 다음 코드를 복사하세요.

정밀한 위치 지정 및 미리보기 제한 사항

돋보기는 작은 세부 사항을 조준하는 데 도움이 됩니다. 이미지에 초점을 맞추고 화살표 키를 사용하여 1픽셀씩, Shift와 화살표를 사용하여 10픽셀씩 이동하며 Enter를 눌러 선택하세요. HEX, RGB 및 HSL에는 개별 복사 버튼이 있습니다. 브라우저에서 디코딩 가능한 소스는 브라우저 sRGB에서 샘플링됩니다. 대신 정규화된 미리보기가 사용되는 경우, 해당 레이블은 색상과 좌표를 근사치로 식별합니다.

유용한 시작 팔레트 추출

3에서 12개의 색상을 선택하여 추출하고 '지배적(Dominant)' 또는 '생생한(Vibrant)'을 시도해 보세요.

색상 및 백분율 추정 방식

'지배적'은 이미지의 주요 색상을 선호합니다. '생생한'은 다채로운 강조 색상에 더 많은 영향을 줍니다. 추출은 경계가 지정된 이미지를 샘플링하고 유사한 색상을 그룹화하여 요청된 수만큼 반환합니다. 평면 이미지는 더 적은 수의 색상을 포함할 수 있습니다. 완전히 투명한 픽셀은 제외되며, 부분적인 불투명도는 픽셀의 가중치를 줄입니다. 백분율은 모든 원본 픽셀의 정확한 수가 아닌 대략적인 샘플링 그룹을 설명합니다. 자동 추출은 이미지를 서버로 업로드합니다.

색상 유지, 교체 및 재정렬

유용한 견본을 잠그고 HEX 값을 편집하거나 선택한 색상 또는 사용자 지정 색상을 추가하세요.

내보내기 전 팔레트 다듬기

견본을 선택하여 색상을 편집하거나, 왼쪽 또는 오른쪽으로 이동하거나, 제거하세요. '잠금'은 '팔레트 새로 고침'을 사용하거나 추출 설정을 변경할 때 선택한 색상을 유지합니다. '팔레트에 추가'는 샘플링된 RGB 색상을 사용하며, '사용자 지정 색상 추가'를 통해 HEX 값을 입력할 수 있습니다. 팔레트는 내보내기를 위해 1에서 12개의 색상을 포함할 수 있습니다. 선택, 편집 및 유지된 잠금 색상에는 임의의 이미지 백분율이 할당되지 않습니다.

투명 픽셀 이해

샘플링 아래에서 소스 색상 또는 배경 위 합성 중 선택하세요.

소스 불투명도 및 내보낸 색상

소스 색상은 복사된 코드에서 선택한 픽셀과 그 불투명도를 보고합니다. 배경 위 합성은 '샘플 배경'과 혼합된 후의 모습을 보여줍니다. 팔레트 색상과 내보내기는 불투명한 RGB 값이므로, 반투명 소스 색상을 추가해도 알파 채널이 유지되지 않습니다. 샘플링 모드는 검사된 색상을 변경하며, 소스 이미지를 다시 칠하거나 자동 추출을 변경하지 않습니다.

텍스트 및 배경 쌍 확인

색상 대비 확인을 사용하여 두 색상을 비교하세요.

대비 결과의 범위

색상 컨트롤로 텍스트와 배경을 선택하고, HEX 값을 입력하거나 선택한 색상을 사용하세요. 미리보기에는 대비 비율과 텍스트에 대한 별도의 일반 AA, 일반 AAA, 대형 AA 및 대형 AAA 결과가 표시됩니다. 이는 선택한 색상 쌍만 확인합니다. 전체 페이지를 감사하거나 모든 배경 이미지를 고려하거나 전체 디자인이 접근 가능한지 인증하지는 않습니다.

다음 단계를 위해 색상 내보내기

팔레트 이미지, 벡터 견본, CSS 변수 또는 구조화된 색상 데이터를 저장하세요.

PNG, SVG, CSS 및 JSON

PNG은 레이블이 지정된 팔레트 카드를 생성합니다. SVG은 견본과 레이블을 벡터 콘텐츠로 유지합니다. CSS는 --color-1과 같은 번호가 매겨진 변수를 내보냅니다. JSON에는 HEX, RGB 및 HSL 값이 포함됩니다. '다른 이름으로 저장'을 선택한 다음 '시작'을 눌러 선택한 확장자로 palette라는 파일을 만듭니다. 색상이나 전체 HEX 팔레트를 복사하는 것이 값만 필요할 때 더 빠를 수 있습니다.

파일 및 처리

입력
JPG, JPEG, PNG, WebP, GIF, BMP, TIFF, HEIC 및 HEIF
출력
하나의 PNG, SVG, CSS 또는 JSON 팔레트

파일당 최대 25 MB까지 업로드 가능. 실행당 하나의 입력 파일.

최대 60 메가픽셀의 소스 이미지 1개. 추출 시 가장자리당 최대 512 픽셀을 샘플링하며, 완전히 투명한 픽셀은 무시하고 요청보다 적은 색상이 반환될 수 있습니다. 내보내기는 1에서 12개의 불투명 팔레트 색상을 지원합니다. 애니메이션 또는 다중 이미지 소스는 첫 번째 정지 프레임을 사용합니다.

이미지는 팔레트 추출을 위해 자동으로 업로드되며 최종 내보내기를 위해 다시 업로드됩니다. 픽셀 선택 및 수동 팔레트 편집은 브라우저에서 실행됩니다. 브라우저가 디코딩할 수 없는 형식은 서버 미리보기가 필요할 수 있습니다. 이 도구는 AI가 아닌 일반적인 색상 처리 방식을 사용합니다.

파일은 서버에서 처리됩니다. 브라우저 디코딩을 사용할 수 없거나 문서 미리보기가 필요한 경우 미리보기 준비를 위해 파일이 업로드될 수 있습니다. 서버 다운로드는 세션당 최대 2시간 동안 이용 가능합니다.

이미지 결과의 경우, 결과 다운로드 아래의 '계속'을 사용하여 호환되는 다음 단계를 선택하세요. 가져올 이미지를 선택할 수 있으며, 다음 도구는 자체 설정으로 시작됩니다.

편집기나 다운로드 페이지를 새로 고치면 도구 페이지로 돌아갑니다. 새 작업을 시작하기 전에 결과를 다운로드하세요. 파일 처리에 관한 개인정보 처리방침을 확인하세요.

FAQ

알아두면 좋은 점

시작하기 전 몇 가지 답변입니다.

임시 서버 처리
이미지에서 HEX, RGB 및 HSL을 얻을 수 있나요?

네. 픽셀을 선택하고 필요한 값 옆의 복사 버튼을 사용하세요. 선택기는 관련이 있을 때 불투명도를 표시하며, 불투명한 팔레트 내보내기에는 RGB 색상이 포함됩니다.

'지배적'과 '생생한'의 차이점은 무엇인가요?

'지배적'은 일반적인 이미지 색상을 강조합니다. '생생한'은 다채로운 강조 색상에 더 많은 영향을 줍니다. 둘 다 샘플링된 근사치이며, 특정 브랜드 색상을 자동으로 찾을 수 있다고 보장하지 않습니다.

6색 요청 시 더 적은 색상이 반환되는 이유는 무엇인가요?

소스에 뚜렷하게 보이는 색상이 더 적을 수 있습니다. 추출기는 요청된 수를 채우기 위해 중복된 견본을 만드는 대신 사용 가능한 그룹을 반환합니다.

팔레트를 새로 고치는 동안 색상을 유지할 수 있나요?

네. 견본을 선택하고 '색상 잠금'을 사용하세요. 내보내기 전에 사용자 지정 HEX 값을 추가하거나, 견본을 재정렬하거나, 색상을 제거할 수도 있습니다.

모든 것이 브라우저에 유지되나요?

아니요. 픽셀 선택 및 팔레트 편집은 브라우저에서 실행되지만, 자동 추출 및 최종 내보내기는 소스를 서버로 업로드합니다. 일부 입력 형식은 서버에서 생성된 미리보기도 필요합니다.

광고

언어38

English العربية Français Italiano Deutsch Español Português Nederlands Русский Türkçe 日本語 中文 हिन्दी Bahasa Indonesia Bahasa Melayu 한국어 Tiếng Việt ไทย Polski Svenska Українська Norsk বাংলা Ελληνικά فارسی اردو Čeština Dansk Magyar Română Suomi Български Filipino ქართული Slovenčina Azərbaycanca עברית Slovenščina

언어를 선택하세요. 동영상 튜토리얼은 현재 영어 내레이션을 사용합니다.