About web-design-guidelines
A review skill for checking Web interfaces against current guidelines. It fetches the latest rules, examines specified files or patterns, and reports findings in a file-and-line format.
Key features
- 01Fetches current guidelines before review
- 02Checks specified files or patterns
- 03Reports findings by file and line
- 04Asks what to review if none is specified
Use cases
- 01Check interface code against guidelines
- 02Review selected files or code patterns
- 03Locate interface guideline violations
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ open-slide/ open-slide --skill web-design-guidelinesAfter installing, type/web-design-guidelinesin Claude Code to confirm it loaded.
Details
From the project READMEWeb Interface Guidelines
Review files for compliance with Web Interface Guidelines.
How It Works
- Fetch the latest guidelines from the source URL below
- Read the specified files (or prompt user for files/pattern)
- Check against all rules in the fetched guidelines
- Output findings in the terse
file:lineformat
Guidelines Source
Fetch fresh guidelines before each review:
https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md
Use WebFetch to retrieve the latest rules. The fetched content contains all the rules and output format instructions.
Usage
When a user provides a file or pattern argument:
- Fetch guidelines from the source URL above
- Read the specified files
- Apply all rules from the fetched guidelines
- Output findings using the format specified in the guidelines
If no files specified, ask the user which files to review.
Comments
Markdown supported