visualize is a skill that stops AI-generated HTML looking agent-made — replacing Inter-and-purple-gradient defaults with on-brand, distinctive output.
AIOpen SourceWeb+1
github.comLoading resources…
wilwaldon/Claude-Code-Frontend-Design-Toolkit
github.com
A curated toolkit of 70+ skills, plugins, MCP servers and CLAUDE.md tricks that make Claude Code output better-looking frontends.
What is wilwaldon/Claude-Code-Frontend-Design-Toolkit?
This repository collects what its author found that actually improves Claude Code's frontend output, organized into ten sections by goal: design skills to kill AI slop, site-wide theming with design tokens, animation and motion with GSAP and Framer Motion, UI/UX intelligence covering patterns and accessibility, a Figma design-to-code pipeline, and testing and browsing tools. Entries are annotated by what you're trying to do, the list is dated April 2026, and pull requests are welcome.
Best for
- Improving Claude Code frontend output
- Finding design skills and plugins
- Setting up a Figma-to-code pipeline
Key features
- 70+ tools across 10 sections
- Design skills and site-wide theming picks
- Animation resources for GSAP and Framer Motion
- UI/UX, accessibility and testing tools
Related resources
github.com
Animation and UI design skills from Emil Kowalski, distilling years at Vercel and Linear into installable skills for designers and engineers.
AIAnimationOpen Source+1
github.com
An open source supply of generated DESIGN.md style guides for any public domain, shaped from live brand identity and markup via Context.dev.
Design SystemsAIOpen Source
designmd.supply
Visitopens in a new tab