skills.rest
sckroll
sckrollCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Updated Mar 11, 2026
Search Tags:#design#ui#code review#accessibility#guidelines#ux
One-click install
npx skills add https://github.com/sckroll/nextjs-mariadb-sample --skill web-design-guidelines-sckroll
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/sckroll/nextjs-mariadb-sample/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/sckroll/nextjs-mariadb-sample --skill web-design-guidelines-sckroll

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure that user interface code adheres to established Web Interface Guidelines, improving consistency and quality.

Core Features & Use Cases

  • UI Code Review: Automatically checks provided files against a set of predefined design and accessibility rules.
  • Compliance Auditing: Audits user interfaces against best practices for web design.
  • Use Case: When you need to quickly check if a new component's styling and accessibility features align with your team's standards before merging.

Quick Start

Review the file 'src/components/Button.tsx' for UI guideline 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 if my UI code meets accessibility and design guidelines?▼

To check if your UI code meets accessibility and design guidelines, you can review your component files against a specified URL of Web Interface Guidelines to automatically audit styling, accessibility, and UX best practices.

What is the best way to audit web interface compliance for a new component?▼

The best way to audit web interface compliance is to provide your component files for an automated review that checks styling and accessibility features against established web design best practices before merging.

Can I review UX patterns against my team's custom web design standards?▼

Yes, you can review UX patterns against custom web design standards by fetching the latest guidelines from a specified URL and applying those rules to your user-provided files and code patterns.

Do I need to provide a guidelines URL to review my UI code?▼

Yes, providing a guidelines URL is required because the review process fetches the latest Web Interface Guidelines from that specified address to evaluate your UI code for compliance.

What types of files can I check for UI guideline compliance?▼

You can check UI component files, such as React components, for guideline compliance by submitting the file paths to be reviewed against predefined design and accessibility rules.

When should I use an automated UI code review instead of manual checks?▼

You should use an automated UI code review when you need to quickly check if a new component's styling and accessibility align with team standards, ensuring consistency and quality before merging.

Related Skills

Explore More Design & Creative Skills→
techwithanirudhtechwithanirudh
3

web-design-guidelines

Audit HTML, CSS, and JavaScript UI code against Web Interface Guidelines.

Community
Intermediate
Tahona-AITahona-AI

web-design-guidelines

Check web interface code for accessibility, usability, and best practice compliance.

Official
Intermediate
csharpfritzcsharpfritz
18

Code Review

Automate code reviews for best practices and style adherence.

Community
Basic
TNHoang2708TNHoang2708
1

ck:web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Community
Intermediate