AI Design Skills
landing-page-design
A skill for building a landing page from scratch: intake questions, page structure, conversion copy and a strict visual system
- 11,951 ★ on the repository
- Last commit
- MIT
Install
- Works in
Manual install
mkdir -p .claude/skills
git clone https://github.com/elayadesign/ai-design-skills.git /tmp/ai-design-skills
cp -r /tmp/ai-design-skills/skills/landing-page-design .claude/skills/Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skill is design rules and copy guidance
This is third-party code. Review the repository files before installing.
What it does
The collection's main skill drives building a high-converting landing page by the rule one offer, one audience, one primary action. The first part decides what the page says and how it is structured: intake questions on the goal, audience, objections and proof, block structure and conversion copy. The second part sets a strict visual system: typography, spacing, corner radius, background, hero layout, icons and motion. The skill's rules take priority over framework defaults, but an explicit user request always wins. The design values live in one section, so the set is easy to tune to your own style.
Who it is for. For designers, marketers and developers who build landing and promo pages.
Good fit when
- You build a landing or promo page from scratch
- You need block structure and conversion copy for one action
- You want a single visual system for the page
Not a fit when
- You need to upgrade an existing site, for which the author has a separate skill
- The task is not about a web page
Example request
Build a landing page for a SaaS launch with a single sign-up goalLimitations
The skill covers building new pages; for redesigning an existing site the author recommends a separate redesign-skill repository. The design values are defaults meant to be tuned to your brand.
How to disable. Remove the landing-page-design folder from your agent's skills directory.
FAQ
Is it for redesign?
For an existing site the author recommends a separate redesign-existing-projects skill; this one builds pages from scratch.
Can I change the visual style?
Yes, the design values live in one section of the skill file; fork and edit it.
Discussion
No questions or reviews yet.
Related
SkillsA design skill against templated AI interfaces: new pages, audits, redesigns and design extraction from a screenshot or URL
Skills against boilerplate-looking UIs: layout, type, motion and spacing, plus reference image generation for web and mobile
A UI, presentation and graphics design skill for coding agents: canvas drafts driven through the superdesign CLI
Skills for design engineers: quick UI cleanup, accessibility, metadata and animation performance fixes
An interface design skill for the agent: diagnosis, four directions to choose, implementation and QA without an AI-template look
A web-design skill for Claude Code: a DESIGN.md spec first, then code that follows it
README in short
The README describes a growing collection of design skills for agents where each skill is a self-contained folder. So far the landing-page-design skill is published for building a landing page: intake questions, page structure, conversion copy and a full visual system. Installation is by copying the skill folder into the agent directory for Claude Code, Cursor, Codex and others. The design values live in one section for tuning to your brand. MIT licensed.
README badge
Original SKILL.md
--- name: landing-page-design description: "Complete system for building high converting landing pages: intake questions, page structure, layout selection, conversion copywriting, SEO, plus strict visual rules for typography, spacing, corner radius, backgrounds, hero layout, icons, and motion. Use this skill whenever building, editing, styling, reviewing, or writing copy for ANY landing page, marketing site, web UI, page section, component, or prototype." --- # Landing Page Design A landing page is not a homepage. A homepage serves multiple intents. A landing page wins one intent: **one offer -> one audience -> one primary action.**