mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-12 06:06:37 +03:00
f5c1bd65ae
* Add codex-grid-background detector rule Detects the Codex two-axis grid-line background tell: a single background value carrying two or more hairline `linear-gradient(... 1px, transparent 1px)` layers (one per axis), usually paired with a repeating `background-size` cell. Gated behind --gpt like the sibling codex tells, off by default. Counts hairline stops within a single background declaration (not across the page) so unrelated single-axis ruled lines don't add up to a false flag, and matches the stop directly rather than parsing whole gradient layers, since colors like oklch(...) carry nested parens. Extends the gpt-tells fixture with one flag case and two pass cases (single-axis rule, two-color blend), regenerates the browser detector bundle, and bumps the rule count 44 -> 45. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * Require tiling background-size for codex-grid-background Address review: two hairline gradients alone draw a fixed crosshair, not a grid. Scope detection to a single style block (CSS rule body or inline style attr) and require both >=2 hairline stops AND a tiling `background-size` px cell in the same block, matching the skill rule's "plus background-size" wording. Add a crosshair-without-tiling pass case. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * Scope codex-grid-background hairline count to background values Address review: count hairline stops only inside background/background-image declaration values, not the whole style block, so a hairline in an unrelated property (mask-image, border-image) can't stand in for the grid's second axis. Add a bg+mask-image hairline pass case. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
89 lines
2.7 KiB
Markdown
89 lines
2.7 KiB
Markdown
# Impeccable CLI
|
|
|
|
Detect UI anti-patterns and design quality issues from the command line. Scans HTML, CSS, JSX, TSX, Vue, and Svelte files for 45 deterministic rules, including AI-generated UI tells, accessibility violations, and general design quality problems.
|
|
|
|
## Quick Start
|
|
|
|
```bash
|
|
# Install skills into your AI harness (Claude, Cursor, Gemini, etc.)
|
|
npx impeccable skills install
|
|
|
|
# Non-interactive install for a specific scope
|
|
npx impeccable skills install -y --providers=claude,codex --scope=project
|
|
|
|
# First command to run inside your AI harness
|
|
/impeccable init
|
|
|
|
# Update skills to the latest version
|
|
npx impeccable skills update
|
|
|
|
# Install or update skills without hook manifests
|
|
npx impeccable skills install --no-hooks
|
|
|
|
# Link skills from a Git submodule checkout
|
|
npx impeccable skills link --source=.impeccable --providers=claude,cursor
|
|
|
|
# List all available commands
|
|
npx impeccable skills help
|
|
|
|
# Scan files or directories for anti-patterns
|
|
npx impeccable detect src/
|
|
|
|
# Scan a live URL (requires Puppeteer)
|
|
npx impeccable detect https://example.com
|
|
|
|
# JSON output for CI/tooling
|
|
npx impeccable detect --json src/
|
|
|
|
# Deprecated compatibility flag; full scan still runs
|
|
npx impeccable detect --fast src/
|
|
```
|
|
|
|
## What It Detects
|
|
|
|
**AI Slop Tells**: patterns that scream "AI generated this":
|
|
- Side-tab accent borders, gradient text on headings
|
|
- Purple/violet gradients and cyan-on-dark palettes
|
|
- Dark mode with glowing accents, border + border-radius clashes
|
|
|
|
**Typography Issues**: overused fonts (Inter, Roboto), flat type hierarchy, single font families
|
|
|
|
**Color & Contrast**: WCAG AA violations, gray text on colored backgrounds, pure black/white
|
|
|
|
**Layout & Composition**: nested cards, monotonous spacing, everything-centered layouts
|
|
|
|
**Motion**: bounce/elastic easing, layout property transitions
|
|
|
|
**Quality**: tiny body text, cramped padding, long line lengths, small touch targets
|
|
|
|
45 deterministic detector rules in total. See the full catalog at [impeccable.style/slop](https://impeccable.style/slop).
|
|
|
|
## Exit Codes
|
|
|
|
- `0`: no issues found
|
|
- `2`: anti-patterns detected
|
|
|
|
## Options
|
|
|
|
```
|
|
impeccable detect [options] [file-or-dir-or-url...]
|
|
|
|
--fast Regex-only mode (skip jsdom, faster but less accurate)
|
|
--json Output findings as JSON
|
|
--help Show help
|
|
```
|
|
|
|
## Requirements
|
|
|
|
- Node.js 24+
|
|
- `jsdom` (included as dependency, used for HTML scanning)
|
|
- `puppeteer` (optional, only needed for URL scanning)
|
|
|
|
## Part of Impeccable
|
|
|
|
This CLI is part of [Impeccable](https://impeccable.style), a cross-provider design skill pack for AI-powered development tools. The full suite includes 23 commands for Claude, Cursor, GitHub Copilot, Gemini, Codex, and more.
|
|
|
|
## License
|
|
|
|
[Apache 2.0](https://github.com/pbakaus/impeccable/blob/main/LICENSE)
|