컬러 유틸리티
HEX, RGB, HSL 색상을 변환하고 웹 접근성을 위한 WCAG 대비율을 확인합니다.
색상 변환
대비 확인 도구 (WCAG)
다람쥐 헌 쳇바퀴에 타고파. 키스의 고유물은 입술이다.
색상 변환 및 대비 확인 도구
HEX, RGB, HSL 색상 형식을 변환하고 전경색과 배경색의 대비를 확인합니다. CSS 구현, 디자인 handoff, hover 상태, UI 접근성 검토에 유용합니다.
자주 쓰는 상황
- CSS 색상 변환: 디자인 도구와 코드 사이의 형식을 맞춥니다.
- 가독성 확인: 버튼, 링크, label, alert의 대비를 확인합니다.
- 색상 변형 만들기: HSL로 밝기와 채도를 조정합니다.
중요한 상태를 색상만으로 표현하지 말고 텍스트, 아이콘, 레이아웃도 함께 사용하세요.
이 도구의 관련 기사
최신 아티클
curl 옵션 정리｜-X -H -d 가 실제로 하는 일과 함정
실무에서 만나는 curl 옵션을 표로 정리했습니다. -d 만으로 이미 POST가 되는 이유, -d 와 --data-raw 의 차이, 앞의 @ 가 조용히 파일을 읽는 함정, 작은따옴표와 큰따옴표의 구분, -k 와 -L 을 쉽게 붙이면 안 되는 이유까지 예제로 설명합니다.
JSON Schema와 Zod를 상호 변환하는 원리｜required와 .optional()의 대응
JSON Schema에서 Zod 스키마를 만들고 Zod 코드에서 다시 JSON Schema를 뽑아내는 양방향 변환기의 구현을 해설합니다. required와 .optional()의 기본값이 반대인 문제, 제약 조건 대응표, 코드를 실행하지 않고 해석하는 방법까지 정리합니다.
SQL 절 실행 순서 레퍼런스｜WHERE에서 SELECT 별칭을 못 쓰는 이유
SQL은 작성한 순서대로 실행되지 않습니다. 논리적 실행 순서(FROM → WHERE → GROUP BY → HAVING → SELECT → ORDER BY → LIMIT)를 축으로, 별칭이 WHERE에서 안 되는 이유, WHERE와 HAVING의 구분, ONLY_FULL_GROUP_BY, COUNT(*)와 COUNT(컬럼)의 차이, LEFT JOIN + WHERE 함정을 예제로 정리합니다.
unified diff 형식 읽는 법｜git diff의 @@ 헤더 완전 해설
git이 출력하는 unified diff 형식을 읽는 법을 정리했습니다. @@ -12,7 +12,9 @@ 의 네 숫자가 뜻하는 것, 한 글자만 고쳐도 줄 전체가 바뀐 것처럼 보이는 이유, 공백과 줄바꿈 문자의 함정, \ No newline at end of file, 머지 커밋의 @@@, similarity index를 통한 이름 변경 감지까지 예제로 설명합니다.
UTC⇄JST/KST 변환 레퍼런스｜9시간 시차 대조표와 타임존 사고 예방법
UTC와 일본 시간(JST)·한국 시간(KST)의 변환을 대조표로 정리했습니다. ISO 8601의 Z와 +09:00의 의미, JavaScript 날짜 파싱이 9시간 어긋나는 조건, MySQL/PostgreSQL의 타임존 동작, GitHub Actions cron이 UTC로 도는 함정까지 예제와 함께 해설합니다.
CREATE TABLE 레퍼런스｜MySQL·PostgreSQL·SQLite의 타입과 제약 조건 차이
CREATE TABLE(DDL) 작성법을 3개 데이터베이스 비교표로 정리했습니다. 타입 대응표, 자동 증가(AUTO_INCREMENT / IDENTITY / rowid)의 방언 차이, 외래 키의 ON DELETE 동작, MySQL이 조용히 무시하는 CHECK 제약까지 예제와 함께 해설합니다.