ck:web-design-guidelines

Review frontend UI code against Web Interface Guidelines and accessibility standards.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/nam3886/golang-echo-boilerplate --skill ck-web-design-guidelines-nam3886
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ck:web-design-guidelines
Source: https://github.com/nam3886/golang-echo-boilerplate/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/nam3886/golang-echo-boilerplate --skill ck-web-design-guidelines-nam3886

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates reviewing frontend code and assets for compliance with Web Interface Guidelines and accessibility best practices, reducing manual audit time and ensuring consistent UX standards across a codebase.

Core Features & Use Cases

  • Guideline Fetching: Retrieves the canonical ruleset from a remote source to ensure checks use the latest Web Interface Guidelines.
  • File Scanning & Analysis: Reads specified files or glob patterns (HTML, CSS, templates, or other UI artifacts) and applies the guideline checks.
  • Terse Reporting: Produces findings in a concise file:line format suitable for developer review or integration into CI pipelines.
  • Use Case: Run as part of a pre-merge check to catch accessibility, consistency, and UX issues in frontend changes.

Quick Start

Ask the skill to review the files or pattern you want audited, for example review templates/*.html for accessibility and design issues.

Frequently Asked Questions about ck:web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit frontend code for accessibility and web design issues?

Automating accessibility and web design audits involves scanning frontend UI code against canonical Web Interface Guidelines. The tool fetches remote rulesets, reads target files or glob patterns, validates rules, and outputs findings in file:line format.

Can I use this to check HTML and CSS files during a pull request review?

Checking HTML and CSS files during a PR review is supported. The tool scans specified HTML, CSS, or template files using glob patterns, applying accessibility and UX rule validations to catch issues before merging.

What is the output format for UI code review findings?

The output format for UI code review findings is a terse file:line format. This concise reporting structure makes results suitable for direct developer review or seamless integration into automated CI pipelines.

Does this tool work with static sites and single-page applications?

Working with static sites and single-page applications is supported. The tool reads UI artifacts and templates from these web projects, applying web interface guidelines and accessibility standards to ensure consistent UX across the codebase.

How are the web interface guidelines updated for design audits?

Updating web interface guidelines for design audits involves fetching the canonical ruleset from a remote URL. This ensures design audits always use the latest accessibility standards and best practices during the code review process.