skills.rest
Pontusg45
Pontusg45COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code files against fetched Web Interface Guidelines rules.

Updated Mar 5, 2026
Search Tags:#accessibility#ui review#code audit#web guidelines#design compliance
One-click install
npx skills add https://github.com/Pontusg45/fubbik --skill web-design-guidelines-pontusg45
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Pontusg45/fubbik/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Pontusg45/fubbik --skill web-design-guidelines-pontusg45

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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

Core Features & Use Cases

  • Automated Review: Scans specified files against a set of predefined design and usability rules.
  • Compliance Checking: Identifies deviations from best practices in UI code.
  • Use Case: A developer can use this Skill to quickly audit a new component's code for accessibility issues and adherence to design system standards before merging it.

Quick Start

Use the web-design-guidelines skill to review the accessibility of 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 audit frontend code for compliance with web interface guidelines?▼

To audit frontend code for web interface guidelines, this Skill fetches the latest predefined design and usability rules to scan your specified UI files, identifying deviations from best practices.

Can I check my UI code for accessibility issues before merging a component?▼

Yes, you can check UI code for accessibility issues by specifying a component file, applying rule-based analysis against established web interface guidelines to ensure adherence before merging.

What is the best way to automate a design compliance review for frontend files?▼

Automating a design compliance review involves fetching external web guidelines via WebFetch and applying rule-based analysis to your provided code files to identify deviations automatically.

Does this web design compliance check require fetching external rules?▼

Yes, verifying web design compliance requires fetching external guidelines via WebFetch, applying those predefined design and usability rules to your provided UI code files for analysis.

How do I ensure my frontend code meets UI accessibility and web standards?▼

To ensure frontend code meets UI accessibility and web standards, the Skill scans provided files against fetched web interface guidelines, identifying non-compliance and checking for design best practices.

Related Skills

Explore More Design & Creative Skills→
NextSpark-jsNextSpark-js

web-design-guidelines

Review UI code against the latest Web Interface Guidelines.

Official
Intermediate
kriangkraiiikriangkraiii
2

web-design-guidelines

Check web interface code for design and accessibility standards compliance.

Community
Intermediate
alissonmds00alissonmds00

web-design-guidelines

Audit web interface code for design and accessibility guideline compliance.

Community
Basic
shynlee04shynlee04

web-design-guidelines

Review UI code against web interface guidelines and report violations in file:line format.

Community
Intermediate