이미지 색상 선택기
사진, 로고 또는 스크린샷을 선택하세요. 픽셀을 고르거나 팔레트를 추출하여 다음 디자인에 사용할 수 있습니다.
PNG, JPEG 또는 WebP · 최대 20MiB, 16메가픽셀
이미지를 선택하고 첫 색상을 골라 주세요.
한 지점을 클릭하거나 탭하세요. 이미지에 초점을 맞춘 뒤 방향키로 한 픽셀씩 이동하고, Shift를 누르면 10픽셀씩 이동합니다. 픽셀 좌표는 왼쪽 위의 0에서 시작합니다.
선택한 픽셀
이미지에서 한 지점을 선택해 주세요.
선택한 색상
이 이미지에서 최대 12개 색상을 저장한 후 값을 다운로드하세요.
두 색상의 조합 확인
샘플 조합을 사용하거나 색상을 입력하거나, 이미지에서 고른 색상을 글자와 배경에 지정하세요. 미리보기와 대비를 확인하고 디자인에 사용할 값을 복사할 수 있습니다.
이미지에서 선택한 색상
이미지에서 픽셀을 선택하고 글자색이나 배경색으로 지정하세요.
새 이미지를 선택하면 샘플 색상 조합으로 초기화됩니다.
투명 색상 아래에 놓일 불투명한 바탕색을 선택하세요.
#RGB, #RGBA, #RRGGBB, #RRGGBBAA, rgb(0, 0, 0) 또는 rgba(0, 0, 0, 0.5)를 사용하세요. RGB 채널은 0~255의 정수, 알파는 0~1입니다.
조합 미리보기
다음 아이디어를 위한 공간
노트를 들고 자리에 앉아 작은 스케치부터 시작해 보세요.
대비율
7.46:1
표시 비율은 반올림됩니다. 통과 여부는 전체 정밀도로 판단합니다.
| 글자 크기 | AA | AAA |
|---|---|---|
| 일반 글자 | 통과 | 통과 |
| 큰 글자 | 통과 | 통과 |
큰 글자는 보통 두께 18pt 이상 또는 굵은 글자 14pt 이상을 뜻합니다. 최종 디자인의 글자 크기를 확인하세요.
조합 상세 정보
{
"standard": "WCAG 2.2 SC 1.4.3 / 1.4.6",
"colorSpace": "sRGB",
"channels": "RGB 0–255; alpha 0–1",
"foreground": [
35,
78,
82,
1
],
"background": [
245,
230,
200,
1
],
"backdrop": [
255,
255,
255,
1
],
"renderedForeground": [
35,
78,
82,
1
],
"renderedBackground": [
245,
230,
200,
1
],
"ratio": 7.46158578805981,
"checks": {
"normalAA": true,
"normalAAA": true,
"largeAA": true,
"largeAAA": true
}
}결과는 이 색상 조합에 관한 것입니다. 글자 가장자리에 앤티앨리어싱이 적용되면 원본 디자인 색상을 사용하세요. 투명도는 선택한 불투명 바탕색 위에서 계산됩니다.
WCAG 대비 가이드이미지에서 팔레트 추출
디자인에 사용할 색상을 추출한 다음 팔레트를 복사하거나 다운로드하세요.
위에서 이미지를 선택하면 팔레트를 추출할 수 있습니다.
선택한 파일과 색상값은 이 페이지 메모리에만 유지됩니다. 도구는 이를 업로드하거나 저장하지 않습니다. 일반 사이트 서비스는 별도로 작동합니다.
직접 만든 여섯 색상 샘플 사용하기
이 PNG 샘플에는 반투명 빨강과 완전 투명 블록을 포함한 여섯 단색 블록이 있습니다. 다운로드한 후 위에서 선택하여 픽셀을 확인하세요.
샘플 PNG 다운로드
이미지 픽셀을 재사용할 색상으로
- 로컬 PNG, JPEG 또는 WebP를 선택하세요. 미리보기는 화면에 맞추지만 색상 추출에는 이미지의 원본 크기를 사용합니다.
- 클릭, 탭 또는 방향키로 픽셀을 선택하세요. HEX는 RGB 채널을, RGBA는 투명도까지 복사합니다.
- 원하는 색상을 저장하고 색상값과 픽셀 좌표를 포함한 JSON 또는 TXT 목록을 다운로드하세요. 다른 이미지를 열면 이전 선택과 목록이 지워집니다.
시작 전에 알아두세요
이 이미지 색상 선택기는 무료인가요?
네. 색상 선택, 복사, 다운로드가 브라우저에서 실행되며 계정이나 크레딧이 필요하지 않습니다.
투명도 값은 무엇을 뜻하나요?
알파는 완전 투명일 때 0, 완전 불투명일 때 255입니다. 알파 없는 HEX와 RGB는 색상 채널을 나타내고, RGBA와 여덟 자리 HEX는 투명도를 포함합니다. 체크무늬는 미리보기 배경이며 이미지에서 추출한 색상이 아닙니다.
다른 앱에서 색상이 다르게 보이는 이유는 무엇인가요?
브라우저가 디코딩한 픽셀값입니다. 이미지 색상 프로필, 브라우저 처리, 화면 설정, 인쇄에 따라 색상이 다르게 보일 수 있습니다. 값을 디자인에 사용하고 최종 사용 환경에서 결과를 확인하세요.
도구가 이미지를 업로드하나요?
아니요. 선택한 로컬 파일을 이 브라우저 페이지에서 디코딩하고 색상을 추출합니다. 도구가 서버로 보내거나 브라우저 기록에 저장하지 않습니다. 페이지 로드와 공개 샘플 다운로드에는 일반 사이트 연결이 사용됩니다.
이미지에서 팔레트를 만들 수 있나요?
네. 팔레트 추출로 세 개, 다섯 개 또는 여덟 개의 대표 색상을 얻은 후 복사하거나 다운로드하세요. 직접 고른 색상도 픽셀 좌표와 함께 최대 12개 저장할 수 있습니다.