🎨

색상 변환기

HEX, RGB, HSL, HWB, LCH, CMYK 및 색상 이름을 포함한 다양한 색상 형식 간 즉시 변환. 고급 색상 선택기 및 미리보기 지원으로 실시간 변환.

HEX, RGB, HSL, HWB, LCH, CMYK 및 색상 이름 간 변환. 색상 선택기 지원으로 실시간 변환.
색상 선택기
#1EA54C
HEX
RGB
HSL
HWB
LCH
CMYK
이름

색상 변환기란

색상 변환기는 RGB, HSL, HEX, CMYK, HWB, LCH를 포함한 여러 색상 모델을 지원하며 형식 변환, 팔레트 생성 및 대비 확인을 제공합니다. RGB는 빨강-녹색-파랑 기본 색상을 사용하고 (0-255), HEX는 16진수 표기법을 사용하며 (#FFFFFF), HSL은 색조-채도-명도를 사용합니다. 웹 디자인, UI 개발, 브랜드 색상 구성표에 널리 사용되어 디자이너가 색상을 빠르게 선택하고 관리할 수 있도록 도와줍니다.

기능

🎨

8가지 색상 형식 지원

HEX (#RRGGBB), RGB (빨강, 녹색, 파랑), HSL (색조, 채도, 명도), HSV, CMYK (인쇄 색상), LAB, XYZ 및 명명된 색상 간 변환. 각 형식은 다양한 사용 사례에 적합: 웹 디자인, 인쇄, 그래픽 및 색상 과학.

실시간 색상 변환

입력, 선택 또는 값을 붙여넣을 때 모든 색상 형식에 걸쳐 즉시 변환. 라이브 색상 미리보기 견본과 함께 HEX, RGB, HSL, HSV, CMYK 값을 동시에 표시하여 모든 형식의 정확한 색상 표현을 쉽게 볼 수 있습니다.
🎯

시각적 색상 선택기

색조/채도/명도 슬라이더가 있는 대화형 색상 선택기, 화면에서 색상을 선택하기 위한 스포이드 도구 및 사전 설정 색상 팔레트. 색상을 시각적으로 미세 조정하고 모든 형식 값이 실시간으로 업데이트되는 것을 확인하세요.
📋

빠른 형식 복사

CSS, 디자인 도구 및 프로그래밍에 적합한 구문으로 각 색상 형식에 대한 원클릭 복사. 웹용 HEX (#FFFFFF), JavaScript용 RGB (rgb(255,255,255)) 또는 인쇄용 CMYK (0%,0%,0%,0%)로 복사.

📋사용 가이드

1️⃣
색상 선택
색상 선택기를 사용하거나 색상 값을 입력하세요
2️⃣
형식 보기
모든 색상 형식이 자동으로 표시됩니다
3️⃣
결과 복사
복사 버튼을 클릭하여 모든 형식 복사

📚기술 소개

🎨색상 모델 및 공간

색상 변환은 다양한 색상 모델 간의 변환을 처리합니다: RGB (화면용 가산 색상, 채널당 0-255 값 사용), HSL (색조 0-360°, 채도/명도 0-100% 지각 모델), HSV/HSB (색조-채도-값/밝기 대체 원통형 모델), CMYK (인쇄용 감산 색상), HWB (색조-흰색도-검은색도 직관적 혼합 모델), LAB (L* 명도, a* 녹색-빨강, b* 파랑-노랑 장치 독립 공간).

⚙️형식 분석 및 검증

도구는 regex 기반 추출 및 검증을 통해 다양한 색상 입력 형식을 구문 분석합니다. 지원되는 구문: 선택적 해시가 있는 HEX (#RGB, #RRGGBB, #RRGGBBAA), CSS 함수 표기법 (rgb(), rgba(), hsl(), hsla(), hwb(), lab(), lch()), 레거시 형식 (rgb(255 255 255), hsl(180deg 50% 50%)), CSS Color Level 4 (rgb(100% 50% 0), oklch(), oklab()) 및 명명된 색상 (대소문자를 구분하지 않는 CSS 키워드).

💡색상 조화 및 접근성

도구는 색상 이론을 기반으로 색상 구성표를 생성합니다: 보색 (180° 색조 회전), 유사색 (±30° 색조), 삼색 (120° 간격), 사색/사각형 (90° 간격), 분할 보색 및 단색 (동일한 색조, 다양한 명도/채도). WCAG 접근성 검사를 구현합니다: 상대 휘도 공식을 사용하여 대비율을 계산하고, WCAG 2.1 수준에 대해 검증 (AA는 일반 텍스트에 4.5:1, 큰 텍스트에 3:1 요구).

자주 묻는 질문

이 색상 변환기 도구는 무엇에 사용됩니까?

이 색상 변환기 도구는 HEX, RGB, HSL, HWB, LCH, CMYK 및 색상 이름을 포함한 다양한 색상 형식 간 변환에 사용됩니다. 실시간 변환, 시각적 색상 선택기 및 즉시 미리보기를 제공합니다. 웹 디자이너, UI 개발자 및 그래픽 디자이너가 다양한 플랫폼과 형식에서 색상을 빠르게 선택하고 관리하는 데 완벽합니다.
💬

색상 변환기를 어떻게 사용합니까?

대화형 색상 선택기를 사용하여 시각적으로 색상을 선택하거나, 모든 형식(HEX, RGB, HSL 등)으로 색상 값을 직접 입력하기만 하면 됩니다. 다른 모든 형식은 실시간으로 자동 변환되어 표시됩니다. 프로젝트에서 사용하기 위해 클립보드에 복사하려면 모든 형식 옆의 복사 버튼을 클릭하세요.
🔍

이 색상 변환기 도구는 무료입니까?

예, 이 색상 변환기는 완전히 무료로 사용할 수 있습니다. 등록 불필요, 결제 불필요. 모든 색상 변환은 브라우저에서 로컬로 처리되어 개인정보 보호 및 보안을 보장합니다. 제한 없이 무제한 색상을 변환할 수 있습니다.
💡

이 색상 변환기의 특별한 점은 무엇입니까?

이 변환기는 LCH 및 LAB와 같은 최신 색 공간을 포함하여 8개 이상의 색상 형식을 지원합니다. 실시간 변환, 슬라이더가 있는 시각적 색상 선택기, 사전 설정 색상 팔레트, 임의 색상 생성 및 각 형식에 대한 원클릭 복사를 제공합니다. 모든 처리는 개인정보 보호 및 오프라인 사용을 위해 브라우저에서 로컬로 수행됩니다.
📚

다양한 색상 형식은 언제 사용해야 합니까?

웹 개발 및 CSS에는 HEX (#FFFFFF), JavaScript 및 화면 표시에는 RGB (rgb(255,255,255)), 직관적인 색상 조정에는 HSL (hsl(0,100%,50%)), 인쇄 디자인에는 CMYK, 장치 독립 색상에는 LAB/LCH, 빠른 프로토타이핑에는 색상 이름 (red, blue)을 사용하세요. 각 형식은 특정 사용 사례에 최적화되어 있습니다.

💡How To & Tips

모범 사례: 처리 전 항상 입력 검증

처리 전 항상 입력을 검증하세요

모범 사례: 사용 사례에 적합한 형식 사용

사용 사례에 적합한 형식을 사용하세요

모범 사례: 적절한 피드백으로 오류 우아하게 처리

적절한 피드백으로 오류를 우아하게 처리하세요

🔗관련 문서

📖W3C CSS Color Module Level 3-CSS 색상 모듈에 대한 공식 사양
🎓W3C CSS Color Module Level 4-최신 CSS 색상 사양 및 새로운 색 공간
ISO/IEC 61966-2-1 - sRGB 색 공간-sRGB 색 공간에 대한 국제 표준

User Comments

0 / 2000
Loading...