skills.rest
Spagestic
SpagesticCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

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

4|1|Updated Oct 17, 2025
Search Tags:#ui#code review#accessibility#web design#guidelines#ux
One-click install
npx skills add https://github.com/Spagestic/thenorthstar --skill web-design-guidelines-spagestic
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Spagestic/thenorthstar/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Spagestic/thenorthstar --skill web-design-guidelines-spagestic

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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

Core Features & Use Cases

  • Automated Code Review: Scans specified files against a set of predefined web interface guidelines.
  • Compliance Checking: Identifies deviations from best practices related to UI, UX, and accessibility.
  • Use Case: A developer can use this skill to quickly audit a new component's code for compliance before merging it into the main branch.

Quick Start

Use the web-design-guidelines skill to review the UI code in the file 'src/components/Button.tsx'.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I review my UI code for web design guidelines and accessibility?▼

To review UI code for web design guidelines, you can use an automated tool that fetches the latest rules and analyzes your specified frontend files for accessibility, design, and UX compliance.

Can I audit a specific frontend component file for UX best practices?▼

Yes, you can audit a specific frontend component file for UX best practices by specifying the file path, such as 'src/components/Button.tsx', and the tool will analyze it against defined web interface rules.

What is automated UI code compliance checking?▼

Automated UI code compliance checking is the process of scanning frontend code against predefined web interface guidelines to identify deviations from established accessibility, UI, and UX best practices.

Does this web design review tool require WebFetch to analyze code?▼

Yes, this web design review tool requires WebFetch to retrieve the latest web interface guidelines and analyze your specified frontend code files against all defined rules.

When do I need to check web interface guidelines before merging code?▼

You need to check web interface guidelines before merging code when you want to ensure new components adhere to accessibility and design best practices, preventing common UI and UX issues in your main branch.

Related Skills

Explore More Design & Creative Skills→
devon87warren-afkdevon87warren-afk

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and best practices.

Community
Intermediate
leafcoderleafcoder
2

web-design-guidelines

Audit web interface code for WCAG, ARIA, and UX compliance.

Community
Intermediate
thanh-abaiithanh-abaii
34

gs:land-and-deploy

Merge pull requests, run CI/CD pipelines, and verify production health.

Community
Advanced
zizhenchen47-osszizhenchen47-oss

web-design-guidelines

Review UI code against Web Interface Guidelines and report file:line findings.

Community
Intermediate