agentsclimarketplace
Sign in

Landing page

Skill MartinOlivero/saas-builder/skills/landing-page

This skill should be used when the user wants to create a landing page, sales page, home page, lead-capture page, or any conversion-oriented page. Trigger phrases include "build a landing page", "make a sales page", "create a home page for my product", "I need a page to sell X", "landing for my SaaS/course/service", "lead capture page". It asks up to 3 questions, applies a proven psychological section order, generates the copy, and produces ready-to-use components.From its SKILL.md

Install
npx -y skills add MartinOlivero/saas-builder --skill landing-page

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

  • 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

SKILL.md

3.3 KB, 677 tokens by cl100k_base, as published. Nobody here has run it

Landing Page

This skill builds landing pages that convert — not just pages that look nice. It combines a proven section order with real copy and production-ready code.

Analogy: a landing page is a salesperson who never sleeps. A good salesperson follows an order — grab attention, name the pain, show the cure, prove it works, ask for the sale. The section structure below is that script.

Workflow

Step 1 — Ask up to 3 questions (no more)

  • What are you selling or offering? (product, service, SaaS, consulting)
  • Who is the ideal customer? (the avatar — be specific)
  • What is the single main action you want the visitor to take? (buy, book a call, sign up, join waitlist)

If the message already answers these, skip ahead.

Step 2 — Build the section structure (proven psychological order)

  1. Hero — clear value proposition + primary CTA. The visitor must understand what this is and why it matters in 5 seconds.
  2. Problem — agitate the customer's pain. Make them feel the cost of not solving it.
  3. Solution — how the product/service resolves that pain.
  4. Features — 3-6 key items, written as benefits, not specifications ("ship in a weekend," not "built with X framework").
  5. Social proof — testimonials, logos, numbers, results.
  6. Pricing — if applicable; clear tiers, one highlighted.
  7. FAQ — kill the top objections before they stop the sale.
  8. Final CTA — restate the value and repeat the main action.

Step 3 — Activate ui-design for the visual system

Hand off to the ui-design skill to generate the design system (style, palette, typography, spacing, dark mode) before writing components. Do not invent visual choices here.

Delegation: the design system itself is sourced per availability — if ui-ux-pro-max is installed, let it generate the system (optionally refined by taste-skill); if neither is installed, fall back to the embedded principles in ui-design. The landing page works either way; the originals just make it sharper. Never block on a missing dependency.

Step 4 — Generate the copy, not just the code

This skill writes the base copy for every section — headline, subhead, body, CTA labels — tailored to the offer and avatar. Code without copy is half a landing page.

Step 5 — Stack and optional add-ons

Default stack: React + Vite + Tailwind. Before building, ask whether the page needs:

  • Animations → Framer Motion
  • A form → React Hook Form
  • Analytics → which provider (e.g. Plausible, GA, PostHog)

Only add these if the user wants them; do not bloat by default.

Step 6 — Output

Deliver ready-to-use components, not prototypes — each section as a real component, wired to the design tokens, with the generated copy in place and empty/loading/error states handled where relevant (e.g. the form).

What ships with it

Read from the repository

Just SKILL.md. No reference files, no scripts.

Gives 0 of the 12 instructions most design frontend skills give in 677 tokens

Counted across 1,179 of the 2,086 authors here whose files we hold, read 2026-09-06

  • Commit to a bold aesthetic directionin 31 of 1179, across 24 files
  • Prefer component composition over inheritancein 28 of 1179, across 14 files
  • Animate only transform and opacity propertiesin 27 of 1179, across 22 files
  • Memoize expensive computations with useMemoin 26 of 1179, across 13 files
  • Use semantic HTML elementsin 24 of 1179, across 23 files
  • Virtualize long lists for performancein 21 of 1179, across 10 files
  • Use CSS variables for design tokensin 20 of 1179, across 14 files
  • Implement loading, empty, and error statesin 20 of 1179
  • Lazy load heavy components with Suspensein 19 of 1179, across 8 files
  • Respect prefers-reduced-motion media queriesin 18 of 1179, across 10 files
  • Prioritize CSS-only animations for HTMLin 18 of 1179, across 16 files
  • Use compound components for related UI elementsin 18 of 1179, across 7 files

Said here and by no other author read

  • Ask up to three discovery questions
  • Follow the proven psychological section order
  • Write benefits instead of technical specifications
  • Delegate visual system generation to ui-design
  • Generate base copy for every section
  • Use React, Vite, and Tailwind by default

Grouped from the skills themselves: near-identical wordings counted once, and counted by distinct author, so one author publishing three of these counts once. Length counted with cl100k_base; the agent that loads this file may tokenize it differently.

Keep looking

Skills are one crate of 325,949. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.