skills.rest
droppii
droppiiOFFICIAL
Explore all skills by this author →
GitHub

ck:web-design-guidelines

Verify web UI code compliance with Web Interface Guidelines and report deviations in file:line format.

Updated Aug 27, 2026
Search Tags:#accessibility#frontend#audit#guidelines#best-practices#web-design#ui-review
One-click install
npx skills add https://github.com/droppii/droppii-agents --skill ck-web-design-guidelines-droppii
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ck:web-design-guidelines
Source: https://github.com/droppii/droppii-agents/tree/main/cursor/skills/web-design-guidelines
Command: npx skills add https://github.com/droppii/droppii-agents --skill ck-web-design-guidelines-droppii

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams ensure that UI code complies with established web interface guidelines, reducing design debt and accessibility gaps.

Core Features & Use Cases

  • Fetch latest guidelines from a reliable source and compare code and assets against them.
  • Analyze frontend files, components, and design artifacts to identify deviations and opportunities for improvement.
  • Use case: when auditing a web app for accessibility, contrast, semantics, and responsive behavior, generate a report of non-conformant items.

Quick Start

Provide a file or pattern and I will fetch the latest guidelines and evaluate the specified files.

Frequently Asked Questions about ck:web-design-guidelines

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

FAQPage Schema
How do I audit frontend code for web interface guidelines compliance?▼

To audit frontend code for web interface guidelines compliance, provide a file pattern and the skill fetches the latest rules to evaluate your assets, reporting deviations in a file:line format.

What is a UI review for accessibility and design debt?▼

A UI review for accessibility and design debt identifies non-compliance by verifying frontend code and shipped components against established web interface guidelines to reduce accessibility gaps.

Can I check design mockups against best-practices web design rules?▼

Yes, you can check design mockups against best-practices web design rules by applying the audit to design artifacts, analyzing them for deviations and opportunities for improvement.

How do I identify UI non-compliance in my web project files?▼

To identify UI non-compliance in web project files, apply checks to your shipped components and frontend assets, parsing the latest guidelines from a source URL to report deviations.

Does this guidelines audit work with frontend files and components in common workflows?▼

Yes, this guidelines audit works with frontend files and components in common workflows, analyzing your web project files and shipped components to generate a report of non-conformant items.

What is the best way to report deviations found during a web design audit?▼

The best way to report deviations found during a web design audit is to parse the fetched rules and output the identified non-compliance items in a structured file:line format.

Related Skills

Explore More Design & Creative Skills→
NodeSentinelNodeSentinel
3

web-design-guidelines

Fetch Web Interface Guidelines and report UI code compliance gaps in file:line format.

Official
Intermediate
gileckgileck

web-design-guidelines

Audit UI code against the latest Web Interface Guidelines.

Community
Basic
t-stringst-strings

Frontend Accessibility

Review frontend UI code for HTML semantics, ARIA, keyboard navigation, and contrast.

Official
Basic
kevinxo328kevinxo328
5

web-design-guidelines

Review HTML, CSS, and frontend files against Web Interface Guidelines.

Community
Intermediate