🎨

색상

색상 변환, 대비, 팔레트

3개의 도구

자주 하는 작업

색상 허브는 HEX/RGB/HSL 변환, WCAG AA/AAA 대비 확인, 랜덤 팔레트 생성, 이미지에서 색상 추출처럼 디자인·CSS 작업에서 바로 필요한 색상 흐름을 묶습니다. 브랜드나 접근성 전체를 자동으로 보장한다고 과장하지 않고, 실제 색상 값과 대비 기준을 빠르게 확인하는 작업에 맞췄습니다.

색상 변환기

HEX, RGB, HSL 값을 서로 변환합니다.

색상 대비 체크

텍스트/배경 대비비와 WCAG AA/AAA 기준을 확인합니다.

랜덤 색상 추천

파스텔, 비비드, 다크 등 팔레트를 생성합니다.

이미지 색상 추출

이미지 픽셀에서 색상 값을 확인합니다.

팔레트 추출

이미지에서 대표 색상 팔레트를 뽑습니다.

작업 흐름

CSS 색상 값 정리

디자인에서 받은 색상 값을 HEX/RGB/HSL로 바꾸고 필요한 표기만 복사합니다.

1
색상 변환기
HEX/RGB/HSL 변환
2
색상 대비 체크
텍스트/배경 대비 확인
3
Meta tag generator
theme-color 등 head 값 준비

팔레트 만들기

새 색상 조합을 만들거나 이미지에서 대표 색상을 뽑아 시안에 적용합니다.

1
랜덤 색상 추천
스타일별 팔레트 생성
2
팔레트 추출
이미지 대표 색상
3
이미지 색상 추출
픽셀 색상 확인

가독성 점검

텍스트와 배경 색상의 대비를 확인하고, 필요하면 다른 색상 조합을 다시 변환합니다.

1
색상 대비 체크
WCAG 대비비 확인
2
색상 변환기
대체 색상 값 변환
3
SERP 미리보기
검색 결과 문구 시각 점검

이미지이미지 색상 추출, 팔레트, 파비콘, SVG 작업과 함께 사용합니다.웹/SEO메타태그, theme-color, SERP 표시 점검으로 이어집니다.

전체 도구

검색

정렬

검색 결과: 3개

색상 변환기

HEX, RGB, HSL 형식 간 색상을 변환합니다.

랜덤 색상 추천

다양한 스타일의 컬러 팔레트를 생성합니다.

색상 대비(컨트라스트) 체크

두 색상의 대비비(Contrast Ratio)를 계산하고 WCAG AA/AAA 통과 여부를 확인합니다.