A growing collection of design skills for AI coding tools, each a self-contained folder you install only as needed. It currently contains exactly one skill, landing-page-design, which builds a landing page from scratch — intake questions, page structure, conversion copy, and a full visual system of type, spacing, radius, and motion. More skills are on the way, and it works with any tool that reads a markdown rules file.面向 AI 编码工具、持续增长的设计技能合集,每个技能都是独立文件夹,按需安装。目前恰好包含一个技能 landing-page-design,可以从零搭建落地页:需求访谈、页面结构、转化文案,以及字体、间距、圆角、动效的完整视觉系统。更多技能正在路上,任何能读取 markdown 规则文件的工具都可用。面向 AI 編碼工具、持續增長的設計技能合集,每個技能都是獨立資料夾,按需安裝。目前恰好包含一個技能 landing-page-design,可以從零搭建落地頁:需求訪談、頁面結構、轉化文案,以及字體、間距、圓角、動效的完整視覺系統。更多技能正在路上,任何能讀取 markdown 規則檔案的工具都可用。AI コーディングツール向けに増え続けるデザインスキルのコレクション。各スキルは自己完結したフォルダで、必要なものだけをインストールする。現在は landing-page-design の 1 件のみで、ヒアリング、ページ構成、コンバージョンコピー、書体・間隔・角丸・モーションの完全なビジュアルシステムを備えたランディングページをゼロから構築する。さらなるスキルが追加予定で、markdown のルールファイルを読み込むツールなら何でも使える。
Quick start快速上手快速上手クイックスタート
What it does
AI Design Skills is a growing collection of design skills for AI coding tools, including Claude Code, Cursor, Codex, and Windsurf. Each skill is a self-contained folder, so you install only the ones you need.
How it works
At present the collection contains exactly one skill, landing-page-design. It builds a landing page from scratch through intake questions, page structure, conversion copy, and a full visual system covering type, spacing, radius, and motion. Its design values live in one section near the bottom of its file, so forking the repo and editing that section changes the rest of the skill automatically.
How to use it
Key points
- It works with anything else that reads a markdown rules file, not only the named tools.
- An existing-site redesign skill lives in its own repo, since it predates this collection.
- The license is MIT, and no attribution is needed for what you build with it.
它是做什么的
AI Design Skills 是一个不断增长的设计技能合集,面向 Claude Code、Cursor、Codex、Windsurf 等 AI 编程工具。每个技能都是独立文件夹,只安装你需要的部分即可。
它怎么工作
目前合集恰好只有一个技能:landing-page-design。它从零构建落地页,流程包括需求提问、页面结构、转化文案,以及涵盖字体、间距、圆角和动效的完整视觉系统。它的设计取值集中在文件底部附近的一个小节,复刻仓库并修改该小节后,其余内容会自动跟随变化。
怎么用
关键要点
- 它也适用于任何能读取 Markdown 规则文件的工具,不限于上述工具。
- 改造已有网站的技能单独放在另一个仓库,因为它早于本合集出现。
- 采用 MIT 许可,用它构建的成果无需署名。
它是做什麼的
AI Design Skills 是一個不斷成長的設計技能合集,面向 Claude Code、Cursor、Codex、Windsurf 等 AI 程式設計工具。每個技能都是獨立資料夾,只安裝你需要的部分即可。
它怎麼運作
目前合集恰好只有一個技能:landing-page-design。它從零建構到達頁,流程包括需求提問、頁面結構、轉換文案,以及涵蓋字體、間距、圓角與動效的完整視覺系統。它的設計取值集中在檔案底部附近的一個小節,複製專案並修改該小節後,其餘內容會自動跟隨變化。
怎麼用
關鍵要點
- 它也適用於任何能讀取 Markdown 規則檔案的工具,不限於上述工具。
- 改造已有網站的技能單獨放在另一個專案,因為它早於本合集出現。
- 採用 MIT 授權,用它建構的成果不需要署名。
何をするのか
AI Design Skills は、Claude Code、Cursor、Codex、Windsurf などの AI コーディングツール向けに増え続けるデザインスキルのコレクションだ。各スキルは自己完結したフォルダで、必要なものだけをインストールする。
仕組み
現時点でコレクションにあるスキルは landing-page-design ただ 1 つだ。ランディングページをゼロから作る。 intake の質問、ページ構造、コンバージョン用のコピー、タイポグラフィ、間隔、角丸、モーションを含む完全なビジュアルシステムを扱う。デザイン値はファイル下部付近の 1 つのセクションに集まっており、リポジトリをフォークしてそこを編集すれば、スキルの残りが自動で追従する。
使い方
押さえておきたい点
- 名前の挙がったツールだけでなく、Markdown のルールファイルを読むものなら何でも使える。
- 既存サイトの改修スキルは、このコレクションより前からあるため、別のリポジトリにある。
- MIT ライセンスで、これで作ったものに帰属表示は不要だ。
Supported platforms支持的平台支援的平台対応プラットフォーム
Claude CodeCursorCodexWindsurfClineGeneric
Notes备注備註備考
Currently contains exactly one skill: landing-page-design.目前恰好包含一个技能:landing-page-design。目前恰好包含一個技能:landing-page-design。現在は landing-page-design の 1 件のみを含む。
Skills included包含的技能包含的技能含まれるスキル
landing-page-design