首页/前端开发/web-design-guidelines
W

web-design-guidelines

by @vercel-labsv
4.9(2,000)

审查UI代码是否符合网页界面设计指南,检查可访问性、设计和用户体验,确保界面质量和标准。

ui-componentsresponsive-designaccessibilityweb-developmentGitHub
安装方式
npx skills add vercel-labs/agent-skills --skill web-design-guidelines
compare_arrows

Before / After 效果对比

1
使用前

过去,审查UI代码是否符合网页设计指南,主要依赖人工检查。这不仅耗时耗力,且容易因主观判断或疲劳而遗漏问题,尤其在可访问性、设计规范和用户体验方面。导致界面质量参差不齐,用户体验下降,甚至可能面临合规性风险。

使用后

现在,通过自动化工具审查UI代码,可以高效准确地检查其是否符合网页界面设计指南。工具能快速识别可访问性缺陷、设计不一致和潜在的用户体验问题,提供详细报告和改进建议。这极大地提升了审查效率和准确性,确保了界面质量和标准,为用户提供更优质、更友好的交互体验。

description SKILL.md

Web Interface Guidelines

Review files for compliance with Web Interface Guidelines.

How It Works

  1. Fetch the latest guidelines from the source URL below
  2. Read the specified files (or prompt user for files/pattern)
  3. Check against all rules in the fetched guidelines
  4. Output findings in the terse file:line format

Guidelines Source

Fetch fresh guidelines before each review:

https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md

Use WebFetch to retrieve the latest rules. The fetched content contains all the rules and output format instructions.

Usage

When a user provides a file or pattern argument:

  1. Fetch guidelines from the source URL above
  2. Read the specified files
  3. Apply all rules from the fetched guidelines
  4. Output findings using the format specified in the guidelines

If no files specified, ask the user which files to review.

forum用户评价 (0)

发表评价

效果
易用性
文档
兼容性

暂无评价

统计数据

安装量286.3K
评分4.9 / 5.0
版本
更新日期2026年4月30日
对比案例1 组

用户评分

4.9(2,000)
5
77%
4
23%
3
0%
2
0%
1
0%

为此 Skill 评分

0.0

兼容平台

🔧Claude Code
🔧OpenClaw
🔧OpenCode
🔧Codex
🔧Gemini CLI
🔧GitHub Copilot
🔧Amp
🔧Kimi CLI

时间线

创建2026年3月16日
最后更新2026年4月30日
🎁 Agent 知识卡片