skills.rest
HiroyukiMakita
HiroyukiMakitaCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Updated Jan 31, 2026
Search Tags:#design#ui#code review#accessibility#guidelines#ux
One-click install
npx skills add https://github.com/HiroyukiMakita/dev-kintone-plugin --skill web-design-guidelines-hiroyukimakita
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/HiroyukiMakita/dev-kintone-plugin/tree/main/.opencode/skills/web-design-guidelines
Command: npx skills add https://github.com/HiroyukiMakita/dev-kintone-plugin --skill web-design-guidelines-hiroyukimakita

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure that web interfaces adhere to established design and accessibility best practices, preventing common UI/UX issues.

Core Features & Use Cases

  • Compliance Checking: Audits UI code against a comprehensive set of web interface guidelines.
  • Accessibility Review: Identifies potential accessibility barriers in the design.
  • Best Practice Validation: Verifies adherence to modern web design standards.
  • Use Case: A developer can use this skill to quickly check a new component's code against Vercel's Web Interface Guidelines before deployment.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.tsx' for compliance.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I check my UI code for web interface guidelines compliance?▼

To check UI code for web interface guidelines compliance, you can review your front-end files against established accessibility and design best practices. This skill audits user-provided code patterns to identify potential UI/UX issues before deployment.

What is a UI code review for accessibility?▼

A UI code review for accessibility is an audit process that identifies potential barriers in web interfaces. It verifies adherence to modern web design standards by checking front-end components against a comprehensive set of established guidelines.

Can I audit a specific component file for accessibility barriers?▼

Yes, you can audit a specific component file for accessibility barriers by providing its path, such as 'src/components/Button.tsx'. The skill reviews the individual file's code to validate compliance with fetched web interface guidelines.

Do I need to provide a URL to review UI against web design standards?▼

Yes, you need to provide a URL to review UI against web design standards. The skill requires fetching the latest guidelines from a specified URL to apply them to your user-provided files or patterns during the compliance check.

What's the best way to prevent common UI/UX issues in front-end development?▼

The best way to prevent common UI/UX issues in front-end development is to run automated compliance checks during your workflow. Auditing UI code against established web interface guidelines ensures interfaces adhere to design and accessibility best practices.

Related Skills

Explore More Design & Creative Skills→
sayeedjoysayeedjoy
12

web-design-guidelines

Review UI code against Web Interface Guidelines and accessibility standards.

Community
Intermediate
runkidsrunkids
11

web-design-guidelines

Audit UI code against Web Interface Guidelines and report violations.

Community
Basic
DevelopersGlobalDevelopersGlobal
65

ci-cd-pipelines

Automate CI/CD pipelines with quality gates and deployment processes.

Official
Advanced
aifuxiaifuxi
437

web-design-guidelines

Audit UI code against Web Interface Guidelines for compliance gaps.

Community
Intermediate