skills.rest
seflless
sefllessCOMMUNITY
Explore all skills by this author →
𝕏@sefllessGitHub

web-design-guidelines

Audit UI code against Web Interface Guidelines and report findings in file:line format.

Updated Jan 24, 2026
Search Tags:#ui#accessibility#audit#guidelines#ux#web-design
One-click install
npx skills add https://github.com/seflless/dot-agents --skill web-design-guidelines-seflless
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/seflless/dot-agents/tree/main/skills/web-design-guidelines
Command: npx skills add https://github.com/seflless/dot-agents --skill web-design-guidelines-seflless

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI teams often struggle to ensure their interfaces comply with established web guidelines, leading to accessibility gaps, inconsistent UX, and missed best practices.

Core Features & Use Cases

  • Guideline Synchronization: Fetch the latest Web Interface Guidelines before review.
  • File Reading & Analysis: Read target UI files or patterns and apply all rules.
  • Reporting: Output findings in a concise, traceable file:line format for remediation.
  • Use Case: A frontend engineer audits a new page to verify color contrast, semantic HTML, and keyboard navigation.

Quick Start

Provide the UI files to review and let the skill fetch and apply the latest guidelines.

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

You can audit front-end code for accessibility by applying the latest Web Interface Guidelines to your UI files. The tool reads target files, checks semantic HTML and color contrast rules, and outputs findings in a concise file:line format.

What is a UI accessibility audit and how does it detect UX gaps?▼

A UI accessibility audit evaluates front-end code against established web guidelines to detect UX gaps. It fetches the latest rules from a source URL and applies them to specified files to identify issues like poor color contrast, missing semantic HTML, and keyboard navigation failures.

How do I check if my front-end codebase meets web interface guidelines?▼

To check if a front-end codebase meets web interface guidelines, supply your UI files for analysis. The tool fetches the latest guideline updates and applies all rules to the specified files, generating a concise report of compliance findings.

Can I review semantic HTML and color contrast in my web UI project automatically?▼

Yes, you can review semantic HTML and color contrast in a web UI project automatically. By providing your target UI files, the tool applies fetched web interface guidelines to analyze the code and returns specific file:line findings for quick remediation.

What format does the accessibility review report use for fixing UI issues?▼

The accessibility review report uses a terse file:line format for fixing UI issues. This concise and traceable output maps each guideline violation directly to the specific location in your front-end codebase, streamlining the remediation workflow.

Does this UX audit work with any front-end codebase or web UI project?▼

This UX audit applies to web UI projects across any front-end codebase. It reads target UI files or patterns directly, fetches the latest web interface guidelines from a source URL, and applies the rules regardless of the underlying framework.

Related Skills

Explore More Design & Creative Skills→
mohamed-g-shoaibmohamed-g-shoaib

web-design-guidelines

Assesses UI files compliance with Web Interface Guidelines via WebFetch and reports findings by file:line.

Community
Intermediate
t-i-0414t-i-0414

web-design-guidelines

Compare UI against Web Interface Guidelines to identify accessibility and UX compliance issues.

Community
Intermediate
gabriellpequenogabriellpequeno
8

web-design-guidelines

Enforce external UI guideline compliance during front-end design reviews and critiques.

Community
Basic
HouseofmvpsHouseofmvps
115

a11y

Detect and fix deterministic WCAG 2.2 A/AA accessibility violations in HTML files.

Community
Advanced