AI 티 안 나는 웹사이트 — 스킬 2개 + 기준 파일 + 검사 명령

HOW I USE IT

AI가 만든 화면의 티는 취향 문제가 아니라 거의 정해진 목록입니다 — ① 글꼴이 늘 Inter나 시스템 기본값 ② 보라→파랑 그라디언트 ③ 카드 안에 카드 ④ 색 있는 배경 위 회색 글자 ⑤ 튕기는 바운스. 오늘 다루는 두 스킬은 이걸 코드로 잡습니다. taste-skill(⭐69,212·MIT)은 배치와 움직임의 기준을 바꿔 평범한 화면에 머물지 않게 하고, impeccable(⭐52,808·Apache 2.0)은 디자인 기준을 만들고 어긋난 곳을 잡아냅니다. 둘은 역할이 달라서 같이 설치해야 효과가 납니다.

⭐ 가장 중요한 건 설치가 아니라 STEP 3입니다 — `/impeccable init`으로 PRODUCT.md·DESIGN.md를 만드는 단계. 참고할 기준이 없으면 AI는 학습된 기본값(무난한 화면)으로 되돌아갑니다. 기준을 파일로 남기면 대화창을 새로 열어도 매번 같은 기준으로 작업합니다. 기준을 정할 때는 '경쟁사와 겹치지 않는 방향으로 주조색·배경색·본문색을 정하고 각각 이유 한 줄, 제목/본문 글꼴 각 하나(Inter·Roboto·시스템 기본 제외), 절대 쓰지 말아야 할 시각 요소 3가지'를 요청해 DESIGN.md에 반영시키세요.

검사는 `detect`로 합니다. 저희가 일부러 만든 'AI 티' 페이지를 검사했더니 글자 그라디언트, 명암 대비 2.5:1(기준 4.5:1 미달), Inter 글꼴, 보라 팔레트까지 안티패턴 5건이 잡혔습니다. 고칠 곳이 없으면 아무 줄도 안 나옵니다 — 조용히 끝나면 통과입니다. 함정 3가지: ①Node 22 이상 필요 ②`--agent claude`가 아니라 `--agent claude-code` ③설치 후 클로드코드 완전 종료→재시작(안 하면 /impeccable을 못 알아듣습니다). 한계도 알아두세요 — 검사기는 '규칙 위반'만 잡습니다. 다섯 가지를 피했다고 좋은 디자인이 되는 건 아닙니다.