Skills brand-landingpage
📦

brand-landingpage

Low Risk ⚙️ External commands🌐 Network access🔑 Env variables

Design a Brand-First Landing Page with Interactive Interviews

Most landing pages fail because they skip the brand identity step. This skill guides users through a structured brand interview, then generates a polished landing page with a matching design system using the Stitch SDK.

Supports: Claude Codex Code(CC)
🥉 73 Bronze
1

Download the skill ZIP

2

Upload in Claude

Go to Settings → Capabilities → Skills → Upload skill

3

Toggle on and start using

Test it

Using "brand-landingpage". Create a landing page for my API tool called DataPipe

Expected outcome:

The skill asks about your product purpose, then guides you through choosing 3 brand adjectives like clean, technical, and modern. After confirming a dark theme with indigo accents, it generates a desktop landing page with hero, code snippet, features, and footer sections.

Using "brand-landingpage". The colors feel wrong, can you change them?

Expected outcome:

The skill asks what feels off about the colors: too bright, too dull, or the wrong hue. After you say too bright, it generates a muted variant with the same layout but adjusted color saturation.

Using "brand-landingpage". I want to compare different layout options

Expected outcome:

The skill generates 3 variants of the landing page with a centered hero, a split layout, and a full-width header. It opens all three in browser tabs and asks which direction you prefer.

Security Audit

Low Risk
v2 • 5/23/2026

All 295 static analysis findings were evaluated against actual file content. All 'weak cryptographic algorithm' findings are false positives caused by hex color codes in brand design reference tables. All 'Ruby/shell backtick execution' findings are false positives from markdown code blocks showing SDK method names and CLI commands. The 'C2 keywords', 'system reconnaissance', 'Windows SAM database', and 'Windows cmd.exe' findings are all false positives resulting from design terminology, brand interview questions, and legitimate file-opening instructions. The 'environment file access' finding is confirmed but represents proper API key management with documented security practices. The 'hardcoded URL' findings are low-severity documentation links for the Stitch SDK. The heuristic 'dangerous combination' finding is a false positive reflecting expected SDK integration patterns (API key + SDK calls + documentation references). No prompt injection, data exfiltration, or malicious intent was detected.

4
Files scanned
841
Lines analyzed
4
findings
2
Total audits
Low Risk Issues (1)
Hardcoded Documentation URLs
SKILL.md contains hardcoded URLs pointing to Stitch SDK documentation. These are legitimate documentation links but represent external network references in the skill instructions.
Audited by: claude View Audit History →

Quality Score

45
Architecture
100
Maintainability
87
Content
43
Community
83
Security
100
Spec Compliance

What You Can Build

Launch a Side Project Landing Page

A developer building a CLI tool or open source project needs a landing page but has no design experience. This skill runs a brand interview and generates a professional page.

Create a Startup Marketing Site

An early-stage startup needs a landing page for their SaaS product. The skill helps define brand identity and produces a page with features, pricing, and testimonials sections.

Build a Developer Portfolio Page

A developer or designer wants a personal portfolio landing page. The skill conducts a brand interview and generates a page with featured projects and about sections.

Try These Prompts

Quick Landing Page Request
Create a landing page for my project called [Project Name]. It is a [description]. The target users are [audience].
Full Brand Interview Workflow
I want to design a landing page for my product [Project Name]. Let me go through the brand interview to define my visual identity first.
Iterative Design Refinement
The hero section on my landing page feels too plain. Can you generate a variant with a bolder layout and more color contrast? Keep the color scheme.
Resume a Saved Session
I have a saved design session from yesterday. Resume from where I left off and help me finalize the bundle for deployment.

Best Practices

  • Complete the brand interview even if you want to skip it. The questions take 5 minutes and make the difference between a generic template and a page that fits your product.
  • Review generated pages by opening the HTML in your browser rather than asking for text descriptions. Visual feedback leads to better design iterations.
  • Save your Stitch API key in your environment before starting so the skill can generate and iterate on designs without interruption.

Avoid

  • Asking the skill to embed your company logo or upload images. The Stitch SDK generates from text prompts and does not accept image inputs.
  • Providing CSS-level feedback like adding padding-top 40px. Translate feedback into design intent such as add more breathing room above the headline.
  • Skipping the mobile variant. The desktop layout often needs adjustments for mobile viewing and generating both ensures a consistent experience.

Frequently Asked Questions

Do I need a Stitch account to use this skill?
Yes. The skill uses the Stitch SDK to generate landing page designs. You need a Stitch account and API key.
What happens if my session is interrupted?
The skill saves progress to a metadata.json file. When you return, it checks the saved state and resumes from where you left off.
Can I use my own brand colors?
Yes. During the brand interview you can provide existing hex values for your brand colors. The skill maps them to the design system.
Does this skill work with images and logos?
No. The Stitch SDK generates pages from text prompts only. User-provided images are saved to the output bundle for manual insertion.
What kind of pages can this skill create?
Single-purpose landing pages and product marketing sites. Not multi-page applications, dashboards, or documentation sites.
Can I edit the HTML after generation?
The skill recommends iterating through the Stitch SDK first. After approval, you can hand-edit the final HTML output.