design-screenshot-spec
Inspect Figma links through MCP or browser computer use, or analyze screenshots and selected-layer properties. Produce frontend specs and clarify unresolved…
Maintain WebDev Agent Kit source rules, skills, metadata, and validators. Excludes upgrading installed copies.
$ npx -y skills add ytvee-dev/webdev-agent-kit --skill agent-rules-skill-author --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/agent-rules-skill-authorContext preview
The summary Claude sees to decide when to auto-load this skill.
Maintain WebDev Agent Kit source rules, skills, metadata, and validators. Excludes upgrading installed copies.
name: agent-rules-skill-author
description: 'Maintain WebDev Agent Kit source rules, skills, metadata, and validators. Excludes upgrading installed copies.'
id: 'agents.skills.agent-rules-skill-author.skill'
title: 'Agent Rules And Skill Author'
doc_type: 'skill'
layer: 'skill'
status: 'active'
publishable: true
local_only: false
skill: 'agent-rules-skill-author'
tags:
- 'agents/skill-package'
- 'agents/authoring'
- 'agents/skill'
parent:
- '[[AGENTS|Canonical Agent Policy]]'
related:
- '[[common/readme-policy|README Read And Edit Policy]]'
- '[[common/rule-audit-findings|Rule Audit Findings]]'
- '[[skills/agent-rules-skill-author/references/documentation-maintenance|Documentation Maintenance Workflow]]'
- '[[skills/agent-rules-skill-author/references/codex-native-skill-contract|Codex Native Skill Contract]]'
- '[[skills/agent-rules-skill-author/references/figma-derived-conventions|Figma Derived Conventions]]'
- '[[skills/agent-rules-skill-author/references/rule-audit-checklist|Rule Audit Checklist]]'
- '[[skills/agent-rules-skill-author/references/rules-writing|Rules Writing]]'
- '[[skills/agent-rules-skill-author/references/skill-design|Skill Design]]'
- '[[skills/agent-rules-skill-author/references/skill-quality-rubric|Skill Quality Rubric]]'
- '[[skills/agent-rules-skill-author/references/source-backed-prompting|Source-Backed Prompting]]'
- '[[skills/agent-rules-skill-author/references/trigger-and-metadata|Trigger And Metadata]]'
- '[[skills/agent-rules-skill-author/references/validation-checklist|Validation Checklist]]'
- '[[common/documentation-maintenance|Documentation Maintenance]]'
depends_on:
- '[[AGENTS|Canonical Agent Policy]]'Create or revise repo-local agent rules and `.agents`-compatible skill packages without leaking project-specific instructions into the wrong layer.
1. Read `AGENTS.md`. 2. Confirm the classified task is `skill-documentation-refactor`, `documentation`, or another `.agents` rule-maintenance task. 3. Read `common/documentation-maintenance.md`. 4. Read affected `common/**`, `skills/**`, `project/**`, manifests, validators, templates, examples, and root pointer files for the requested change. 5. Apply `common/readme-policy.md`: read targeted README sections when the request concerns README, public setup guidance, or docs/implementation drift; verify technical claims through higher evidence. 6. Read relevant references from this skill only when their topic is in scope. 7. Read current OpenAI Codex docs when native skill behavior, `AGENTS.md`, MCP, plugins, or `agents/openai.yaml` behavior may have changed.
design intake through `design-screenshot-spec` and the capability manifest.
1. Classify the target layer: `AGENTS.md`, manifests, validators, `common/**`, `project/**`, `templates/**`, `examples/**`, or `skills/**`. 2. Treat README as optional human-facing context, never runtime policy or validator truth. Do not edit it unless the current user explicitly requests that README change. 3. Confirm whether a new skill is needed or an existing skill/reference/common rule should be edited. 4. Define trigger surface, non-trigger cases, inputs, outputs, defaults, tool contract, failure modes, and validation gates. 5. Keep skill packages in the standard section order used by this bundle. 6. Keep graph frontmatter and Codex UI/invocation metadata synchronized; keep capability declarations in `tool-capabilities-manifest.json`. 7. Remove stale links after renames or deletions. 8. Validate changed skill packages and run documentation checks.
Final response: return only facts that affect the user's understanding, confidence, or next action. Omit empty fields and workflow narration.
Report:
client-tool dependencies belong there; optional providers belong in the capability manifest.
does not introduce whiteboard/canvas writes or hard provider dependencies.
A cross-platform frontend kit for Codex, Claude Code, Cursor, OpenCode, etc. It helps AI coding agents work predictably and safely with existing frontend projects.
Repo: ytvee-dev/webdev-agent-kit
Inspect Figma links through MCP or browser computer use, or analyze screenshots and selected-layer properties. Produce frontend specs and clarify unresolved…
Create, resume, analyze, or converge standard and deep frontend execution plans with traceable slices, evidence, and stop/resume state. Skip lightweight…
Plan architecture and ownership for standard or deep React/Next.js work across routing, state, data, styling, forms, builds, migrations, and implementation…
Diagnose and fix frontend defects from evidence, including unclear UI/runtime errors, broken routes, styling regressions, and hydration or client issues.…
Set subject-grounded visual direction for standard or deep UI work, redesign, polish, critique, anti-template review, or design handoff. Skip technical…
Review inspected designs or briefs for product-flow gaps and ask evidence-based user questions. Ground UI direction in audience, patterns, and UX risks;…