Skill Locker
All skills
v1.3.03 loop iterations

Landing Page Builder

A landing page has one job — convert a visitor with specific intent into a specific action — and most fail because they're trying to inform instead of persuade. The Landing Page Builder ships deployable HTML/CSS with conversion architecture baked into every section.

What this skill does

A landing page is not a homepage. It exists to convert one specific visitor into one specific action — sign up, buy, book, download — and every element either serves that conversion or hurts it. Most landing pages underperform because they were built from a template without anyone understanding why each section exists, so when the creator edits the copy they accidentally remove the parts doing the work.

This skill ships complete, deployable HTML and CSS following a nine-section sequence: hero, problem, solution, features paired with benefits, social proof, how-it-works, objection handling, pricing (if applicable), final CTA. Each section has a stated purpose written into the output so the user knows which lever they're touching when they edit. The hero answers "am I in the right place?" in five seconds. The problem section makes the reader nod. Features lead with benefit, not feature ("drag-and-drop editor — pages built in minutes, not hours"). Social proof lands after features to validate the claims just made, not before them.

CTA discipline is enforced. One conversion goal per page — no competing buttons asking the visitor to also subscribe to the blog. Outcome-oriented CTA copy ("Start My Free Trial" not "Submit"). Repeated at least three times — hero, mid-page, final. Micro-copy under the button to reduce anxiety ("No credit card required" / "Cancel anytime"). Forms are minimised to name and email unless something extra is genuinely needed — every additional field drops completion by roughly 7%.

The code is vanilla HTML and CSS with minimal JS. No framework dependencies for a single page. Mobile-first, responsive down to 375px, lazy-loaded below-fold images, sub-3-second target load time. Accessibility built in — heading hierarchy, alt text, contrast, keyboard-navigable CTAs — not bolted on. Two fonts maximum. One primary action colour, used only on CTAs, never diluted on decorative elements.

Output includes bracketed placeholders for content only the user can supply — real testimonials, real metrics, real photos — and refuses to fabricate them. A landing page with invented social proof is a legal problem in some verticals and a trust problem in all of them. The skill writes the persuasion; the user supplies the truth.

When this triggers

  • ·You're launching a product, course, service, or event and need a page that converts paid traffic
  • ·Your current page is a homepage being asked to do a landing page's job
  • ·You want the page structure to follow proven conversion sequence, not a Webflow template
  • ·You need copy + code together — not a wireframe to hand to a developer next month
  • ·You're running ads to this page and the bounce rate is killing your CPA

Example

Trigger

User: 'Need a landing page for a $97 weekend course on writing Claude Code skills. Traffic from X. Goal: signups.'

Output

Architecture (9 sections, each with a stated purpose): 1. Hero — H1: "Ship Your First Claude Code Skill This Weekend" Sub: "For developers who want to stop reading about skills and start building. [N students through, real rating]." CTA: "Reserve My Seat — £97" 2. Problem — three bullets in their language 3. Solution intro — bridge sentence 4. What you'll build — 6 outcome-paired features 5. Social proof — 3 specific testimonials with names + roles 6. How it works — 3 steps (Sat morning, Sat afternoon, Sun) 7. FAQ — 7 objections (price, time, prereqs, refund, ...) 8. Final CTA — repeat hero CTA + 14-day refund line 9. Footer Deliverable: one .html file, vanilla CSS, mobile-first, [bracketed] placeholders for assets the user supplies. Includes per-section notes explaining WHY each section exists, so user edits don't break the conversion logic.

Get this skill + 10 more

Get the full Websites & Landing Pages pillar (11 skills) or the complete library.

Get the full stack — $299

What you get

  • 160-line SKILL.md, ready to drop into ~/.claude/skills/
  • Tested through 3 Karpathy-loop iterations (versions v1.0.0 → v1.3.0)
  • Triggers automatically when relevant — no command to remember
  • Lifetime updates as the skill is refined further

More from Websites & Landing Pages

Browse the full library

297 skills across 31 categories. One purchase, lifetime updates.

See all bundles