How to use the Landing Page Design agent skill

What does the Landing Page Design skill make the agent do?

When the skill is installed, the agent follows a fixed playbook whenever it builds or edits a landing page, marketing site or web UI component. It starts by gathering key facts: the one main action, the offer, the audience and the proof points. It then plans the page in a set order, with headline, call to action, proof and FAQ placed deliberately, and writes copy using specific, outcome-focused formulas.

The skill has two parts. Part A covers strategy and structure: intake questions, page layout, conversion copy and SEO. Part B is the visual system, which sets rules for typography, spacing, corner radius, backgrounds, hero layout, icons and motion. The agent is meant to work through Part A before touching Part B, so the output follows consistent design rules instead of generic framework defaults.

• Asks for missing facts in one batch, or states a reasonable assumption and continues
• Orders the above-the-fold content as headline, subheadline, primary CTA, one proof signal, then hero visual
• Chooses one of four layout types (classic hero, long form, minimal conversion, comparison) and says why
• Builds the page section by section in a fixed order: hero, benefits, how it works, proof, FAQ, final CTA

How do you install the Landing Page Design skill?

The skill ships as a ZIP file that you can download from the product page. Choose one of two install routes depending on how you use your agent.

For Claude Code, unzip the download into your user skills folder at ~/.claude/skills/, or into a project's .claude/skills/ folder if you want the skill only for that project. The skill is made of a single file, SKILL.md, so the folder should contain that file.

In the Claude apps, you can instead upload the skill under Settings → Capabilities → Skills.

• Route 1: download the ZIP from the product page and unzip it into ~/.claude/skills/ for all projects
• Route 2: unzip it into a project's .claude/skills/ folder for one project only
• Route 3: in the Claude apps, go to Settings → Capabilities → Skills and upload the skill

How do you trigger the skill with natural requests?

You do not need to type the skill name. The skill description tells the agent to use it whenever you build, edit, style, review or write copy for any landing page, marketing site, web UI, page section, component or prototype. It also applies when you never mention design, conversion or a design system.

Plain requests work well. Describe the page, the audience and the goal, and let the agent ask the intake questions it needs. If you are not sure the skill was used, ask the agent to follow the landing page design rules or to check its font, spacing and CTA choices against them.

• Build a landing page for a waitlist for our budgeting app aimed at freelancers
• Rewrite the hero copy on our pricing page so it states the outcome and has one clear CTA
• Review this signup section against the landing page design rules and list the changes
• Create a marketing site homepage component with a FAQ and a final call to action

What should you prepare before you ask for a page?

The skill asks for specific facts, so answering them quickly gives better results. The intake covers the purpose, the audience and context, the proof you have, and constraints such as brand voice and whether mobile matters most. You do not need every answer. If you skip one, the agent states its assumption in one line and keeps going.

Gather proof you can actually publish, such as logos you have permission to show, testimonials, numbers, screenshots or a demo video, and any refund or cancellation terms. The skill places proof beside the claim it supports, so the more real proof you provide, the more useful the page.

• The one primary action, such as trial, demo, buy, waitlist or download
• The offer, stated exactly, and what counts as a conversion
• The audience, the problem they want solved, and their top three objections
• Traffic source (ads, search, social or email) and the brand voice you want
• Proof assets and any guarantee or cancellation terms

What are the safety notes and limits?

The skill is a single instruction file. It does not run scripts and does not use the network, and it lists no other requirements. Installing it adds guidance to the agent; it does not give the agent new tools or access to your systems. Read the file before installing if your organisation reviews agent skills.

The skill is opinionated. Its visual rules ban certain fonts, including Inter and Roboto, and ban italic and black weights. Those rules may override an established brand system, so do not use the skill to change a site that already has its own design system without reviewing the result. For upgrading an existing site, the file points to a separate companion skill, redesign-existing-projects, which defers to this file for concrete values.

The skill targets web interfaces and marketing pages. It is not meant for non-web work.

• Runs scripts: no. Uses network: no. Requires: nothing listed.
• Banned fonts include Inter, Roboto, Arial, Open Sans and Helvetica; allowed primary fonts include Geist, Manrope and Poppins
• Not suitable for redesigning a site that already has a brand system, unless you review each change

What tips get the best results?

Ask for one section at a time when you are iterating. The skill's build order is section by section, which keeps changes easy to review. Mention your traffic source, because the skill advises that the hero should mirror the headline of the ad that sent the visitor.

When a request conflicts with a rule, the skill says your explicit prompt wins. If you want a font or layout the rules forbid, say so directly in the request so the choice is deliberate.

• Work section by section instead of asking for a full rebuild on each change
• Name the traffic source so the hero matches the ad headline
• Keep one primary CTA above the fold and avoid competing CTAs
• Check that the page's FAQ and proof sections are present before publishing