Wink Pings

He Used AI to Build These Landing Pages, Then Open-Sourced the Design Skills

Every landing page in the video was built over the past two months with Higgsfield, Claude, and Cursor. The style is consistent and doesn't look like something AI casually generated. The designer open-sourced the skills behind them, and your agent can install them today.

Every landing page in the video was built over the past two months with Higgsfield (AI video generation), Claude, and Cursor. Blue-toned landscape illustrations, coastlines, white classical buildings, and ships sailing into the distance. The page style is consistent and doesn't look like something AI could generate in one pass.

Afterward, the designer open-sourced this set of design skills: github.com/elayadesign/ai-design-skills

This is a growing repository called ai-design-skills, made for AI coding tools such as Claude Code, Cursor, Codex, and Windsurf. Each skill is an independent folder containing a SKILL.md rules file—essentially setting up a design contract for the AI.

It currently offers two skills:

  • landing-page-design: Build a landing page from scratch, including requirements questions, page structure, conversion copy, and a complete visual system (typography, spacing, border radius, motion)
  • design-to-motion: Turn static designs into pixel-perfect animated presentations, exported as MP4 and GIF

Want to redesign an existing website? The corresponding redesign-skill is in another repository.

Each skill's design values are concentrated in a section at the bottom of the file. Typography, colors, spacing, and motion are all there. Fork the repository, change that section, and the entire skill's style automatically changes with it. The designer's aesthetic judgment is compressed into the AI's default parameters.

Installation isn't complicated. For Claude Code, for example:

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/<skill-name> .claude/skills/

For Cursor, just download SKILL.md and put it in the .rules directory, or paste it into Settings → Rules for AI. Codex uses AGENTS.md, and Windsurf uses .windsurfrules. If you don't want to touch the terminal, download SKILL.md, drop it into a Claude.ai project, and say follow this.

Some people in the comments said open-sourcing the design skills is the most valuable move in this whole thing. Others asked: are these just text rules, or do they come with example layouts? Some also wondered whether these pages look so consistent because they all share one layout system.

These discussions all point to the same thing: rules. Templates aren't hard to find; what's hard is writing judgments about aesthetics, layout, and conversion copy into explicit rules so the AI doesn't drift each time it runs.

MIT license: use it, modify it, sell it—attribution isn't even required. The repository owner is elayadesign.

This repository pushes AI design one step beyond one-off generation. Your agent can install this set of rules today. The interesting question next is: who will open-source their own design rules too?

发布时间: 2026-10-26 02:50