TastefulKit 1 view · 24h
← AI skills

Frontend Design — Anthropic

Guides an agent from a product brief to a distinctive interface, with deliberate typography, color, layout and motion rather than generic template styling.

frontend-designtypographylanding-pagesvisual-design
View skill source ↗ Repository ↗

181469 GitHub stars (repository-wide; checked Oct 16, 2026)

992675 skills.sh installs (checked Oct 16, 2026)

When to use it

Best for new landing pages or a substantial visual redesign. Provide the real product, audience, content and constraints; the workflow plans a visual system, checks it against the brief, builds and critiques. This is aesthetic guidance, not a component library or accessibility certification.
Research checked against upstream documentation on 2026-09-30. Compatibility is upstream-documented, not runtime-tested by TastefulKit.

Compatible agents

Claude Code

Installation

In Claude Code, run /plugin marketplace add anthropics/skills, then /plugin install example-skills@anthropic-agent-skills. Ask the agent to use frontend-design for your interface brief.

Review the source and instructions before installing in your agent.

License

Apache-2.0

Last checked Sep 30, 2026.

Pair this skill with a visual reference

A skill guides how your agent works; a design reference shows the direction you want. Choose an example for a specific job, such as the headline hierarchy or form layout, and keep your project's existing design rules explicit.

Start with design references you can inspect, then use our guide to briefing an AI coding agent to turn observations into requirements. If you need implementation components, compare UI libraries for your stack.

These pages are public. Browsing a skill does not install it, and TastefulKit's design-reference MCP tools do not search the AI-skill directory.