← ClaudeAtlas

frontend-designlisted

Create distinctive production-grade product UI, marketing pages, and redesigns. Use when building or styling frontend components, pages, or applications; routes by interface type and iterates rendered output to avoid generic AI aesthetics.
buildproven/claude-kit · ★ 0 · Web & Frontend · score 65
Install: claude install-skill buildproven/claude-kit
> Derived from Anthropic's Apache-2.0 `frontend-design` skill and substantially > modified by buildproven. Changes include expanded production guidance, the > AI-ism denylist, product/marketing routing, intent and preflight checks, > redesign auditing, and original design-reference datasets. See the license > files in this directory and the repository `NOTICE` for provenance. This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices. The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints. ## Route before designing Classify the work first: - **Product UI** — dashboards, admin, settings, internal tools, SaaS applications, tables/forms/lists, or anything people repeatedly work in. Read `references/product-ui.md`. - **Marketing UI** — landing pages, portfolios, launches, editorial pages, or anything whose first impression carries the job. Read `references/marketing-ui.md`. - **Redesign** — an existing interface must improve without losing working behavior or brand equity. Read `references/redesign.md` plus the relevant product/marketing guide. Do not apply marketing-page spectacle to a daily-use product interface. ## Design Thinking Before coding, produce a compact design read: - **Hu