Hero first. Then benefits. Then the product explanation, social proof, FAQs, and final CTA.
Want to try it?
The easiest installation method is the Skills CLI:
npx skills add elayadesign/ai-design-skills --skill landing-page-design
It supports Claude Code, Codex, Cursor, Windsurf, and other compatible AI coding agents.
Or simply give Claude Code this prompt:
"Install the landing-page-design skill from the GitHub repository elayadesign/ai-design-skills into this project's .claude/skills directory.
Then use it to create a landing page for my project.
Before starting, ask me all the necessary questions in a single message."
Using Codex?
You can install it through the same Skills CLI, which places the skill in .agents/skills/.
Alternatively, ask Codex to incorporate the skill's SKILL.md instructions into your project's AGENTS.md file.
And here's why I find this useful.
AI coding models have become extraordinarily good at implementing interfaces.
But knowing how to write React components isn't the same as knowing how to design a convincing product page.
Great design requires judgment.
What deserves attention? What should disappear? How should the page guide someone from curiosity to action?
Skills like this help turn professional design experience into reusable instructions for AI agents.
Of course, this won't automatically turn every generated website into a masterpiece.
You'll still need good content, appropriate visual references, and a few iterations.
But it's a considerably better starting point than another vague prompt asking for a "modern, clean, stunning website."
The future of AI web design might not be about writing better prompts every time.
It might be about giving our agents better design judgment from the beginning.
And this one's free.
AI Design Skills on GitHub:
https://github.com/elayadesign/ai-design-skills
Landing Page Design skill:
https://github.com/elayadesign/ai-design-skills/tree/main/skills/landing-page-design
Free and open source under the MIT license.
#ClaudeCode #OpenAICodex #AIDesign #LandingPageDesign #WebDesign #VibeCoding #AIWebDevelopment
YouTube / ABVX