OpenSource-Hub

impeccable

CLI 도구

pbakaus/impeccable

AI 프론트엔드 디자인 언어 및 명령어 세트

개요

Impeccable는 공유된 디자인 용어, 도메인 참조 및 안티 패턴 규칙을 제공하여 AI 모델의 프론트엔드 디자인 출력을 향상시킵니다. 여기에는 23개의 명령이 포함되어 있으며, 다양한 코딩 어시스턴트의 스킬로 사용될 수 있습니다.

README 미리보기

# Impeccable\n\nThe vocabulary you didn't know you needed. 1 skill, 23 commands, and curated anti-patterns for impeccable frontend design.\n\n> **Quick start:** Visit [impeccable.style](https://impeccable.style) to download ready-to-use bundles.\n\n## Why Impeccable?\n\nAnthropic's [frontend-design](https://github.com/anthropics/skills/tree/main/skills/frontend-design) was the first widely-used design skill for Claude. Impeccable started from there.\n\nEvery model trained on the same SaaS templates. Skip the guidance and you get the same handful of tells on every project: Inter for everything, purple-to-blue gradients, cards nested in cards, gray text on colored backgrounds, the rounded-square icon tile above every heading.\n\nImpeccable adds:\n- **7 domain reference files** ([view source](skill/)). Typography, color, motion, spatial, interaction, responsive, UX writing. Load on every command, alongside a brand-vs-product register that adjusts the defaults.\n- **23 commands.** A shared design vocabulary with your AI: `polish`, `audit`, `critique`, `distill`, `animate`, `bolder`, `quieter`, and more.\n- **27 deterministic anti-pattern rules** plus a 12-rule LLM critique pass. CLI and browser extension run the deterministic ones with no LLM and no API key. Each is tied to specific design guidance the skill teaches against.\n\n## What's Included\n\n### The Skill: impeccable\n\nA comprehensive design skill with 7 domain-specific references ([view skill](skill/SKILL.src.md)):\n\n| Reference | Covers |\n|-----------|--------|\n| [typography](skill/reference/typography.md) | Type systems, font pairing, modular scales, OpenType |\n| [color-and-contrast](skill/reference/color-and-contrast.md) | OKLCH, tinted neutrals, dark mode, accessibility |\n| [spatial-design](skill/reference/spatial-design.md) | Spacing systems, grids, visual hierarchy |\n| [motion-design](skill/reference/motion-design.md) | Easing curves, staggering, reduced motion |\n| [interaction-design](skill/refer

FAQ (3)

문제 해결
impeccable의 detect.mjs를 실행할 때 'bundled detector not found' 오류가 발생하는 이유는 무엇인가요?

이 오류는 npx skills 설치 프로그램이 스킬 하위 트리(skill subtree)만 배포하고 검출기 엔진(detector engine)이 누락되었기 때문에 발생했습니다. 최신 릴리스에서 문제가 해결되었으므로 스킬을 업데이트하세요. 업데이트가 불가능한 경우 다음 해결 방법을 사용하세요: mkdir -p .agents/skills/impeccable/scripts/detector && ln -sf "$(pwd)/node_modules/impeccable/cli/engine/detect-antipatterns.mjs" .agents/skills/impeccable/scripts/detector/detect-antipatterns.mjs. 이 명령은 impeccable npm 패키지의 엔진을 예상 위치에 심볼릭 링크로 연결합니다.

원본 Issue #168
문제 해결
critique-storage.mjs 스크립트가 Windows에서 출력을 반환하지 않는 이유는 무엇인가요?

스크립트의 진입점 가드가 import.meta.url(Windows에서는 슬래시 사용)과 file://${process.argv[1]}(백슬래시)를 비교했기 때문에 동등성 검사가 실패하여 main()이 호출되지 않았습니다. 이 버그는 v3.1.1에서 구분 기호를 정규화하는 pathToFileURL(process.argv[1]).href로 전환하여 수정되었습니다. 다음 명령어로 스킬을 업데이트하십시오: npx skills add pbakaus/impeccable

원본 Issue #155
방법
세션 간에 Impeccable critique 결과를 유지하여 해결된 문제를 다시 제기하지 않도록 하는 방법은 무엇인가?

이전 비평 출력을 저장하기 위해 수동 CRITIQUE.md 파일을 생성하세요. 새로운 /impeccable critique를 실행하기 전에, 에이전트에게 맥락을 위해 CRITIQUE.md를 읽고 검토 후 업데이트하도록 지시하세요. 이 해결 방법은 내장 지속성이 도입될 때까지 제안된 기능을 모방합니다.

원본 Issue #128