Color Toolkit

디자이너가 슬랙 메시지에 16진수 코드를 입력하고, 개발자는 CSS 변수에 해당하는 RGB 값이 필요하며, 또 다른 누군가는 새로운 브랜드 파란색 배경에서 흰색 텍스트가 제대로 읽힐지 알고 싶어 합니다. Color Toolkit은 바로 이러한 순간들을 위해 존재합니다. 작지만 끊임없이 반복되는 색상 계산은 필요 이상으로 많은 시간을 잡아먹습니다.

Color Toolkit의 핵심은 실시간 변환기입니다. 16진수, RGB, HSL, CMYK 값을 입력하면 다른 세 가지 색상도 즉시 업데이트되어 추가 탭이 필요하지 않습니다. 스타일시트에서 "rgb(...)" 또는 "hsl(...)" 문자열을 그대로 붙여넣으면 자동으로 파싱됩니다. 범위를 벗어난 값은 오류를 발생시키는 대신 제한되고 플래그가 지정되므로 편집 도중에 멈추거나 프로그램이 충돌하는 일이 없습니다.

색상 변환 외에도, Shade Generator는 어떤 기본 색상이든 입력받아 10단계의 명암 단계를 한 번의 탭으로 생성할 수 있어, 단일 브랜드 색상에서 일관된 UI 팔레트를 구축하는 데 매우 유용합니다. 콘트라스트 체커는 접근성 감사자가 사용하는 것과 동일한 계산 방식을 사용하여 정확한 비율을 제공하고, AA 및 AAA 등급, 일반 및 큰 텍스트에 대한 합격/불합격 여부를 명확하게 표시해 줍니다. 따라서 더 이상 명암 설정에 추측에 의존할 필요가 없습니다.

중요한 색상은 모두 개인 팔레트에 저장하고 타임스탬프를 기록하며 순서를 변경할 수 있어, 프로젝트 전반에 걸쳐 언제든지 다시 사용할 수 있습니다.

주요 기능:
- 실시간 4방향 색상 변환(HEX, RGB, HSL, CMYK)
- 붙여넣은 CSS 색상 문자열 자동 파싱
- 10단계 명암/색조 변화 생성기
- WCAG 명암 비율 검사기(AA/AAA 배지 포함)
- 타임스탬프가 포함된 개인 팔레트 저장 기록
- 모든 화면의 색상 계산 방식을 설명하는 내장 가이드

컬러 툴킷을 사용하면 10분씩 걸리던 색상 계산 작업을 단 10초 만에 완료할 수 있습니다.