vercel-react-view-transitions
82Implement React View Transitions
React view transitions are easy to misplace, causing silent or noisy animations. This skill guides route, Suspense, list, and shared element animation choices.
Review Web UI Against Design Guidelines
Teams need consistent UI reviews before visual issues reach users. This skill checks interfaces against current Web Interface Guidelines and reports concise file-line findings.
Copy this request to your Agent. It includes the canonical Skill page and manifest.
Review the Skillstore skill "web-design-guidelines" from https://skillstore.io/skills/vercel-labs-web-design-guidelines.md and its manifest at https://skillstore.io/api/skills/vercel-labs-web-design-guidelines/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Your Agent should still show its plan and request any confirmation required by the security policy.
Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.
Using "web-design-guidelines". Review components/Button.tsx.
Expected outcome:
components/Button.tsx:18 - Button label may not describe the action clearly.
Using "web-design-guidelines". Review app/settings/** for design issues.
Expected outcome:
Findings are grouped by file, with line references for layout, accessibility, and copy concerns.
Using "web-design-guidelines". Review the selected dashboard files.
Expected outcome:
No issues found after checking the selected files against the guidelines.
The Markdown backtick findings are false positives and do not represent command execution. The skill has a real network dependency because it tells agents to fetch mutable external guidelines from GitHub before each review. I found one additional semantic risk where fetched remote content is treated as authoritative review instructions.
These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.
Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.
https://skillstore.io/skills/vercel-labs-web-design-guidelines/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/vercel-labs-web-design-guidelines?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/vercel-labs-web-design-guidelines?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/vercel-labs-web-design-guidelines/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/vercel-labs-web-design-guidelines.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>vercel-labs. (2026). web-design-guidelines security audit report (audit version 5) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/vercel-labs-web-design-guidelines/audits/5@techreport{vercel-labs-vercel-labs-web-design-guidelines-2026,
author = {vercel-labs},
title = {web-design-guidelines security audit report (audit version 5)},
institution = {Skillstore},
year = {2026},
number = {5},
url = {https://skillstore.io/skills/vercel-labs-web-design-guidelines/audits/5},
note = {Author version 1.0.0}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-design-guidelines security audit report (audit version 5)"
version: "1.0.0"
type: report
authors:
- name: "vercel-labs"
date-released: "2026-07-07"
url: "https://skillstore.io/skills/vercel-labs-web-design-guidelines/audits/5"
identifiers:
- type: other
value: "skillstore:vercel-labs-web-design-guidelines:audit:5"
description: "Skillstore immutable audit report identifier"
Each author remains a separate installable skill. The recommended variant is ranked by Skillstore evidence.
Why this variant is first
vercel-labs-web-design-guidelines
2026-08-21
zhanlincui-web-design-guidelines
2026-08-21
antvu-web-design-guidelines
2026-08-21
antfu-web-design-guidelines
2026-08-21
supercent-io-web-design-guidelines
2026-08-21
sickn33-web-design-guidelines
2026-08-21
Check changed frontend files before merging a feature branch.
Find interface consistency and usability issues across a product area.
Identify likely accessibility concerns in selected UI components.
Review app/page.tsx against the Web Interface Guidelines. Report concise findings with file and line references.
Review the checkout UI files in app/checkout/** for accessibility, layout, interaction, and copy issues.
Review components/**/*.tsx before release against the latest Web Interface Guidelines. Prioritize issues that affect users.
Review app/** and components/** with extra focus on keyboard access, responsive behavior, error states, and information density.
Author
vercel-labsLicense
MIT
Author version
v1.0.0
Skillstore revision
r1
Ref
36e07d5e13068e5be64447e8f20b427cf2cbd21a
Maintenance freshness
7/18/2026
Usage
45 downloads ยท 266 views
File structure
๐ SKILL.md
Implement React View Transitions
React view transitions are easy to misplace, causing silent or noisy animations. This skill guides route, Suspense, list, and shared element animation choices.
Create Better AI Skills
Building reusable AI skills can be inconsistent without clear structure. This skill guides Claude, Codex, and Claude Code through design, scaffolding, validation, and packaging.
Optimize React and Next.js Code
React and Next.js applications often lose performance through waterfalls, large bundles, and avoidable re-renders. This skill gives Claude, Codex, and Claude Code concrete review rules for faster frontend work.
Refactor React Components With Composition
Large React components often become brittle when boolean props control many modes. This skill guides Claude, Codex, and Claude Code toward compound components and provider-based state.
Optimize React Native Apps
React Native apps can suffer from slow lists, janky animations, and platform mistakes. This skill gives Codex, Claude, and Claude Code concise rules for performant Expo and React Native work.
Build Better Next.js Apps
Next.js code can fail when patterns drift across framework versions. This skill guides Claude and Codex with focused rules for App Router, RSC, data, assets, and deployment.
Audit Web Accessibility for WCAG Compliance
by 89jobrien
Accessibility gaps can block users and create compliance risk. This skill guides WCAG audits, screen reader checks, keyboard testing, and remediation planning.
Design Distinctive Production Frontends
by Atman36
Generic interfaces weaken product identity and usability. This skill guides purposeful visual direction, responsive implementation, motion, accessibility, and production-ready frontend code.
Design Distinctive UI Prototypes
by tencentcloudbase
Generic AI interfaces often lack visual direction and platform-aware detail. This skill guides Claude, Codex, and Claude Code to define design intent before building prototypes.
Improve UX With Research-Led Design Guidance
by shubhamsaboo
Teams often design flows from assumptions and miss accessibility issues. This skill guides research, structure, interaction design, and review using UX best practices.
Check designs with deterministic CSS rules
by cubha
Design reviews can vary between reviewers and slow down delivery. This skill applies repeatable checks to HTML and CSS so teams can catch token, layout, and accessibility issues before release.
Design Accessible Product Interfaces
by sickn33
Teams often struggle to turn user needs into consistent, accessible interfaces. This skill guides research, flows, design systems, tokens, and handoff.