다플 로고다플 도구모음
🎨
색상

컬러 피커

색상을 선택하고 HEX · RGB · HSL 코드를 복사하세요.

#3b82f6
#

명도

60%

보색

C47D09
R
G
B

색상 코드

HEX#3B82F6
HEX 소#3b82f6
RGBrgb(59, 130, 246)
RGBArgba(59, 130, 246, 1)
HSLhsl(217, 91%, 60%)
HSLAhsla(217, 91%, 60%, 1)
CSS var--color: #3B82F6;
Tailwind[#3B82F6]

Tints & Shades

밝게 (Tints)

어둡게 (Shades)

팔레트

(0/20)

저장된 색상이 없어요

그라디언트 생성기

색상 1 (현재)

#3b82f6

색상 2

방향

CSSbackground: linear-gradient(to right, #3b82f6, #ec4899);복사
Tailwindbg-gradient-to-r from-[#3b82f6] to-[#ec4899]복사

명암 대비 검사기

WCAG 2.1

본문 텍스트 Sample Text

소형 텍스트 · Small 12px

전경색 (텍스트)

배경색

명암비

3.68

:1

AA

≥4.5

AAA

≥7

AA
큰글

≥3

공유하기

공유하기

컬러 피커 사용법

색상 선택기에서 원하는 색상을 고르거나 HEX 코드를 직접 입력하면 HEX, RGB, HSL 형식을 바로 복사할 수 있습니다. 팔레트에 최대 20개의 색상을 저장하고, 보색과 밝기 변형(Tints/Shades)으로 배색 작업을 효율적으로 하세요. 그라디언트 생성기와 WCAG 명암 대비 검사로 접근성 높은 UI 색상도 쉽게 만들어보세요.