skills.rest
derKlinke
derKlinkeCOMMUNITY
Explore all skills by this author →
Website𝕏@fabiansklinkeGitHub

web-design-guidelines

Audit HTML/CSS/JS assets against the Web Interface Guidelines.

Updated Aug 23, 2026
Search Tags:#accessibility#audit#ui-design#design-review#web-guidelines#web-standards
One-click install
npx skills add https://github.com/derKlinke/codex-config --skill web-design-guidelines-derklinke
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/derKlinke/codex-config/tree/main/skills/web-design-guidelines
Command: npx skills add https://github.com/derKlinke/codex-config --skill web-design-guidelines-derklinke

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the evaluation of UI code against established Web Interface Guidelines, helping you identify noncompliance and accessibility gaps quickly.

Core Features & Use Cases

  • Guideline-driven audits: Validate HTML/CSS/JS assets against the latest Web Interface Guidelines.
  • Accessibility checks: Flag color contrast, keyboard navigation, and semantic HTML issues.
  • Use Case: When given a set of web pages, run checks and generate a concise report that highlights violations and recommended fixes.

Quick Start

Run a guidelines check on your project by providing the files or patterns to review, e.g., audit UI/index.html.

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

Yes, accessibility checks flag color contrast, keyboard navigation, and semantic HTML issues. The audit evaluates your web UI code against the latest Web Interface Guidelines and reports violations with recommended fixes.

How do I check multiple web files for UX pattern violations?▼

To start a guidelines check, provide the files or patterns to review, such as 'audit UI/index.html'. The tool reads the specified files, applies all Web Interface Guidelines rules, and generates a concise report of violations.

Does the UI audit work with plain HTML and CSS assets?▼

When you run an audit, the tool fetches the latest Web Interface Guidelines using the WebFetch tool, reads your specified files, applies all rules, and outputs findings in a file:line format for quick identification of noncompliance.

What is the output format for web design guideline violations?▼

This audit is limited to evaluating web UI projects against Web Interface Guidelines. It checks HTML, CSS, and JS assets for accessibility, layout, and UX patterns but does not modify your code; it only outputs findings in a file:line format.

Related Skills

Explore More Design & Creative Skills→
JEO-tech-aiJEO-tech-ai
8

web-design-guidelines

Scan frontend files and report UI guideline violations with file:line locations.

Community
Intermediate
ShutovKSShutovKS
3

web-design-guidelines

Identify UI design and accessibility gaps against Web Interface Guidelines.

Community
Intermediate
guichefferguicheffer
3

web-accessibility

Enforce WCAG 2.1 AA compliance using semantic HTML, ARIA attributes, axe-core, and jest-axe automated tests.

Community
Intermediate
NikileshReddyTNikileshReddyT

web-design-guidelines

Fetch web interface guidelines and evaluate UI files for accessibility and design conformity.

Community
Intermediate