skills.rest
MinhQuyen274
MinhQuyen274COMMUNITY
Explore all skills by this author →
GitHub

ck:web-design-guidelines

Reviews web UI code compliance with Web Interface Guidelines via configurable upstream source rules.

Updated Aug 27, 2026
Search Tags:#accessibility#ui audit#web guidelines#ux best practices#design compliance#frontend code review
One-click install
npx skills add https://github.com/MinhQuyen274/smartify --skill ck-web-design-guidelines-minhquyen274
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ck:web-design-guidelines
Source: https://github.com/MinhQuyen274/smartify/tree/main/Frontend_PROJECT_Figma/.opencode/skills/web-design-guidelines
Command: npx skills add https://github.com/MinhQuyen274/smartify --skill ck-web-design-guidelines-minhquyen274

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you catch accessibility, usability, and guideline compliance issues in a web UI before they ship, reducing user friction and design/code inconsistencies.

Core Features & Use Cases

  • Guideline-driven UI review: Fetches the latest Web Interface Guidelines rules and applies them consistently to your code.
  • Targeted file or pattern auditing: Reviews specific files you provide, or prompts for what to scan when nothing is specified.
  • Actionable results: Produces findings in a terse file:line format so you can quickly locate and fix issues.

Quick Start

Use the ck:web-design-guidelines skill to review the specified UI files for Web Interface Guidelines compliance.

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 my web UI code for accessibility and UX best practices?▼

To audit web UI code for accessibility and UX best practices, specify your front-end source files for review. The tool fetches the latest Web Interface Guidelines rules and applies them to produce actionable compliance findings.

What is the output format for a web design guidelines compliance review?▼

A web design guidelines compliance review outputs findings in a terse file:line format. This format helps developers quickly locate and fix accessibility, usability, and design inconsistencies directly in the audited source files.

Can I scan specific files for web interface guideline compliance, or does it review everything?▼

You can scan specific files or file patterns for web interface guideline compliance. If you do not specify any files, the review process will prompt you to provide the target files needed to execute the audit.

How does a guideline-driven UI review fetch its compliance rules?▼

A guideline-driven UI review fetches its compliance rules by retrieving the latest command rules from a configured upstream source. It requires this prior guideline retrieval before applying any checks to your front-end code.

When do I need to run a frontend code review for design compliance?▼

You need to run a frontend code review for design compliance when you want to catch accessibility, usability, and guideline issues in your web UI before they ship, reducing user friction and design inconsistencies.

Related Skills

Explore More Design & Creative Skills→
ENG-BXIENG-BXI
1

web-design-guidelines

Audit React/Next.js UI files against the Web Interface Guidelines checklist.

Community
Intermediate
CallMeLuigiv2CallMeLuigiv2

web-design-guidelines

Audit UI code against current Web Interface Guidelines for accessibility and UX compliance.

Community
Basic
lord007tnlord007tn
4

web-design-guidelines

Compare UI source files against fetched Web Interface Guidelines and report violations.

Community
Intermediate
patrickhaahrpatrickhaahr

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and design quality.

Community
Basic