Skip to content

Brand Landing Page Designer

Interviews you about your brand, then generates and refines a landing page via Stitch as deployable HTML.

Repository
wshobson/agents
Stars
42,095
Licence
MIT
Files
4 files

What it does

When installed, the agent stops generating generic templates and first runs a short brand interview covering your product, the feeling your brand should convey, and colors, fonts and shapes. It then uses the Stitch design service to generate landing page screens, shows them for feedback, iterates, and packages a deployment-ready HTML bundle with a DEPLOY.md file. Project state is saved in a local metadata file so work can resume later.

Great for

  • Developers or founders launching a side project or product who have no visual direction yet
  • Marketers who need a single-purpose product landing page quickly
  • Teams that want a brand-first process rather than picking a random template

Skip it if

  • Projects that already have a design mockup or design tokens: the skill says to use frontend-design instead
  • Dashboards, app UIs, multi-page apps or documentation sites, which are outside its stated scope
  • Work requiring image or logo uploads, since the file states Stitch does not accept image uploads via API

Try asking

  • “Create a landing page for my new budgeting app, I have no brand colors yet”
  • “Design a homepage for my waitlist product that feels modern and friendly”
  • “Build a marketing page for my SaaS side project and export it for deployment”
Step-by-step guide: how to use Brand Landing Page DesignerInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 4 original files, the MIT licence and an attribution note.

    brand-landingpage.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip brand-landingpage.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip brand-landingpage.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Answer the interview questions with concrete examples, such as apps or sites whose look you admire, to get better results
  • Give specific feedback during the generate and review loop, since iteration is the core of the workflow
  • Keep your Stitch API key in a .env file or shell profile and never paste it into chat

What's inside

  • references/interview-framework.md
  • references/state-and-pitfalls.md
  • references/stitch-architecture.md
  • SKILL.md

Redistributed unmodified from wshobson/agents under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.