Antigravity Skills - Build and Discover AI Agent SkillsAntigravity Skills

Frontend Design Skill Skill · Frontend design

Frontend Design Skill: Give Every Interface a Design Thesis

Frontend Design Skill turns a brief into a clear design thesis, reviewable choices, rendered critique, and a finished production interface.

  • Frontend design
  • Design thesis
  • Responsive UI

About This Skill

Frontend Design is Anthropic's design-lead Skill for building or reshaping interfaces with one thesis, one signature, real content, and a bounded visual verification pass.

Quick Start

  1. 1Frame the subject, audience, single job, stack, real content, and fixed constraints.
  2. 2Write a thesis with direction, palette, type, layout, signature, motion, and content choices.
  3. 3Run the subject-specific swap test and revise transferable choices before coding.
  4. 4Build the real states, then render representative desktop and mobile views and critique them.

Core Capabilities

One clear thesis

The plan names a visual world, why it fits the subject, and the signature the interface should be remembered by.

Reviewable design choices

Palette, type, layout, motion, and real content are explicit before the first component is written.

Swap-test discipline

Structural devices must encode sequence, category, boundary, or thesis rather than decorative trend signals.

Rendered critique finish

The loop ends with real states, responsive views, interaction checks, and a named critique list.

SKILL.md

# Frontend Design

This edition derives from Anthropic's frontend-design Skill at commit 2235be7c60b551f5de82ade908fd3816455afcda.

## Design loop

Frame the job, write a thesis, run the subject-specific swap test, build from the thesis, and verify delivery through a rendered critique. Use real content and preserve product behavior in reshape work.

The natural package remains SKILL.md plus LICENSE.txt. The edition changes the instruction file only; no screenshots or rendered proof are included in this release edition.

Frequently Asked Questions

FAQ

What is Frontend Design Skill?
It is Anthropic's design-lead Skill for building or reshaping interfaces with a thesis, signature, real content, and a rendered critique.
What did the candidate change?
The optimized SKILL.md makes the five-phase loop and completion criteria explicit, adds the swap test, and ties the build phase to real states and quality checks.
Is it a generic frontend tutorial?
No. The Skill is an agent workflow that uses the project stack, brief, content, and incumbent visual truth as authorities for the requested surface.
Is a rendered page proof available?
No. Comparison screenshots and galleries are intentionally not rendered in this release edition; the proof plan requires a fixed brief, working implementation, viewport checks, and human review.
Can I download it now?
Yes. Download the approved immutable Frontend Design Skill: Build Distinctive Production Interfaces package from this page. Its source revision, file count, byte size, SHA-256, and release receipt are shown here; this evidence does not claim runtime outcomes.

Discussion

Discussion

0 comments
U

On This Page