Skills
.Work. You
Rest

Webdesign

Community

Design, integrate, and ship web UI fast.

Design & Creative#design tokens#web design#ui integration#claude design#accessibility verification#code handoff
Authorjulianobarbosa
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Webdesign removes the gap between visual design exploration and real, integration-ready changes inside an existing codebase, so you can land UI work without rebuilding from scratch.

Core Features & Use Cases

  • Claude Design orchestration: Drives claude.ai/design through the Interceptor skill to generate prototypes and design-system-aware outputs.
  • Integration-aware diffs: Produces patches against an existing app (not isolated HTML), reusing app tokens and component patterns.
  • Production handoff: Exports a Claude Design handoff bundle for downstream code generation via the frontend-design plugin, then verifies results.
  • Verification & deployment: Screenshots and a11y-probes designs, then optionally deploys to common hosts (Cloudflare Pages, Vercel, Netlify, GitHub Pages, S3).

Quick Start

Run Webdesign to integrate a redesigned pricing page into your Astro app by asking to land the prototype into your target route in the existing codebase.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: Webdesign
Download link: https://github.com/julianobarbosa/.claude/archive/main.zip#webdesign

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.