web-design-guidelines

Validate HTML, CSS, JavaScript, and component files for Web Interface Guidelines compliance, outputting file:line findings.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/Norfolk-Group/H-Analytics --skill web-design-guidelines-norfolk-group
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Norfolk-Group/H-Analytics/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Norfolk-Group/H-Analytics --skill web-design-guidelines-norfolk-group

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the review of frontend UI code to ensure compliance with authoritative Web Interface Guidelines, accessibility standards, and general UX/design best practices, reducing manual checklist work and human error.

Core Features & Use Cases

  • Fetches authoritative guidelines from the provided remote URL before each run to ensure reviews use the latest rules.
  • Rule-driven code audit: Reads specified files or patterns, applies guideline rules, and reports violations in a terse file:line format suitable for quick triage.
  • Use Case: A frontend engineer or designer runs the skill against component and stylesheet files to detect accessibility issues, inconsistent spacing, and guideline violations before a release.

Quick Start

Fetch the guidelines and review the specified files or pattern for Web Interface Guidelines compliance, returning findings in file:line format.

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 accessibility and UX guideline violations?

Auditing frontend code for accessibility involves fetching authoritative Web Interface Guidelines from a remote URL, applying rule-driven checks to HTML, CSS, and JavaScript files, and outputting violations in a terse file:line format for quick triage.

What is the best way to check UI components for visual consistency before release?

Checking UI components for visual consistency is best done by running an automated rule-driven audit against fetched Web Interface Guidelines, which detects inconsistent spacing and accessibility issues across component source files before release.

Can I review HTML and CSS files against a remote design system automatically?

Yes, you can review HTML and CSS files against a remote design system automatically by fetching the latest guideline document from a specified remote URL before each run, ensuring your code reviews always use the most current rules.

Does this accessibility audit work with JavaScript and component source files?

This accessibility audit does work with JavaScript and component source files, reading specified file patterns to validate frontend UI code for compliance with Web Interface Guidelines and general UX best practices.

What format are accessibility and design violations reported in during a code review?

Accessibility and design violations are reported in a terse file:line format during a code review, making the audit results suitable for quick triage and efficient resolution of frontend UI compliance issues.