AZ Tools

카테고리

색상

정렬:

색상 거리 (ΔE)

두 색의 지각적 차이를 숫자로 — CIE76 ΔE·CIEDE2000 ΔE·일반 RGB 거리, 나란한 스와치.

색상00

색온도

Kelvin 값 슬라이드 → 흑체 색이 따뜻한 호박색에서 중성 흰색·차가운 파랑으로 이동. 일반 광원 프리셋 포함.

색상00

Tailwind 색상 팔레트

전체 Tailwind CSS 기본 팔레트 — 22가지 색상 × 11단계 음영(50~950) — Tailwind 클래스·HEX·rgb()로 클릭 복사.

색상00

HSL 색상 픽커

Hue·Saturation·Lightness·Alpha 슬라이더로 색 조정 — HEX·RGB·HSL·Tailwind 임의 값 복사.

색상00

CSS Named Colors

147개 CSS / X11 named color — HEX·RGB·실시간 스와치, 검색·색상 계열별 그룹화.

색상00

색상 명도·채도 변형 생성기

기본 색에서 틴트(밝게)·셰이드(어둡게)·톤(회색 혼합) 생성. 2~20 단계, HEX·RGB·HSL 출력.

색상00

컬러 믹서

두 색상을 RGB·HSL·CIELAB 공간에서 보간. 11단계 중간 그라데이션 스트립 표시.

색상00

CSS Cubic-Bezier 곡선 생성기

제어점을 드래그해 CSS 이징 곡선 설계 — 모션 미리보기, cubic-bezier() 값 복사.

색상00

CSS 삼각형 생성기

순수 CSS로 8방향 삼각형 — border 트릭 또는 clip-path, 규칙 복사 후 붙여넣기.

색상00

Border Radius 생성기

코너 독립 드래그, 타원 반지름, CSS 복사 — 채팅 버블·필·블랍·탭 프리셋 포함.

색상00

CSS clamp() 계산기 (유체 타이포그래피)

두 뷰포트 너비 사이를 부드럽게 스케일하는 `font-size: clamp(...)` 생성 — 한 줄 복사.

색상00

CSS 필터 플레이그라운드

blur·brightness·contrast·hue·sepia·invert 등 9개 필터 시각 조합 — CSS 또는 Tailwind 임의값으로 복사.

색상00

이미지에서 컬러 팔레트 추출

이미지를 드롭하면 Canvas로 주요 색을 분석해 팔레트 추출 — HEX 복사 또는 전체 일괄 복사.

색상00

색맹 시뮬레이터

8가지 색각 이상(CVD)에 따라 이미지가 어떻게 보이는지 시뮬레이션.

색상00

CSS Box Shadow 생성기

여러 레이어로 CSS box-shadow를 디자인 — 실시간 미리보기 + CSS·Tailwind 출력.

색상00

컬러 포맷 변환기

어떤 색이든 HEX·RGB·HSL·HSV·OKLCH·CSS 변수로 한 번에 변환.

색상00

CSS 그라디언트 생성기

선형·방사형 CSS 그라디언트를 다중 색상 스톱으로 디자인하고 코드를 복사하세요.

색상00

컬러 팔레트 생성기

기준 색에서 여섯 가지 배색으로 조화로운 팔레트를 만드세요.

색상00

색상 대비 검사기

글자/배경 대비를 WCAG AA·AAA 기준으로 검사하세요.

색상00

컬러 정렬

hex 색상 리스트 붙여넣기 → 색조·채도·명도·체감 밝기 기준 정렬. 디자인 토큰 팔레트 정리에 유용.

색상00