사용 방법
1
코드 넣기HEX, rgb(), hsl() 중 아무 형식이나 넣거나 색 고르기로 골라요.
2
변환 확인다른 형식의 코드가 바로 나와요.
3
대비 확인흰 글자·검은 글자가 잘 읽히는지 대비 값을 봐요.
이럴 때 쓰면 좋아요
- 🎨 디자인 시안 색상을 CSS 코드로 옮길 때
- 🖌 브랜드 색 RGB 값을 인쇄소·개발자에게 줄 때
- ♿ 버튼 색 위 글자가 잘 보이는지 접근성을 점검할 때
색상 코드 형식
HEX는 빨강·초록·파랑을 16진수 두 자리씩(00~FF)으로 쓴 거예요. #3182F6은 빨강 49, 초록 130, 파랑 246이에요. RGB는 같은 값을 10진수로 쓴 거고, HSL은 색상(0~360도), 채도(%), 밝기(%)로 나타내서 "조금 더 밝게"처럼 조절하기 편해요.
명도 대비는 두 색의 밝기 차이를 1:1(같음)부터 21:1(흰색과 검은색)까지로 나타내요. 웹 접근성 지침(WCAG)은 일반 글자에 4.5:1 이상을 권장해요.
자주 묻는 질문
CMYK도 되나요?
화면 색(RGB)과 인쇄 색(CMYK)은 변환 기준이 장비마다 달라서 지원하지 않아요.
이미지에서 색을 뽑고 싶어요.
이미지 색상 추출을 쓰세요.
투명도(알파)는요?
rgba의 투명도는 무시하고 색만 바꿔요.
3자리 HEX도 되나요?
#36F처럼 넣으면 #3366FF로 바꿔 줘요.
함께 쓰면 좋은 도구
JSON 정리·검사JSON 들여쓰기 정리, 한 줄로 압축, 오류 위치.Base64 인코딩·디코딩글자를 Base64로, Base64를 글자로 (UTF-8).URL 인코딩·디코딩한글 주소를 %EC%95%88 형식으로, 다시 한글로.HTML 특수문자 변환< > & " 를 < >로, 엔티티를 글자로.유닉스 타임스탬프 변환1767225600 ↔ 날짜·시간 (KST·UTC).해시 생성기 (SHA)SHA-1·SHA-256·SHA-512 해시값 만들기.UUID 생성기무작위 UUID v4를 원하는 개수만큼.정규식 테스트정규표현식 패턴이 어디에 맞는지 바로 확인.