本文へ移動
cccskills
無料GitHub で公開日本語紹介

voltagent-awesome-design-md

実在する73サイトの配色・書体・余白・部品の仕様をまとめたDESIGN.mdを使い、AIエージェントに統一感のあるUI制作を頼むためのデザイン資料集です。

原文原文の説明を見る

73 个真实网站 DESIGN.md 提取集合(Claude / Cursor / Vercel / Stripe / Apple / Tesla / Ferrari ...)。把 DESIGN.md 复制到项目根目录,AI agent 读 DESIGN.md 后能生成风格一致的高质量 UI。

本仓库同步自 VoltAgent/awesome-design-md。关键词:DESIGN.md, Google Stitch, UI 设计, 设计系统, Claude, Cursor, Vercel, Stripe, Apple, Tesla。

anbeime/skillスター 8,891(GitHub 8,891 + cccskills 0)
連携ツールStripeVercel

実行スコア 未検証

インストール方法を見る

こんなときに便利

  • 新しいUIの参考を探したいとき
  • AIに画面のデザイン規則を渡したいとき
  • 業種別のデザインを比較したいとき

日本語での紹介

できること

実在する73サイトのデザイン仕様を参考に、AIエージェントへUIの見た目を伝えられる資料集です。各DESIGN.mdには配色、書体、余白、コンポーネントの仕様がまとめられています。AI関連サービス、開発ツール、金融、自動車、レトロなWebサイトなどから、目的に合うスタイルを選べます。

こんなときに便利

新しいページのデザイン方針を決めたいときや、AIが作る画面の見た目をそろえたいときに向いています。参考サイトの印象を言葉だけで説明する代わりに、Markdownで書かれた具体的な仕様を渡せます。

使い方の例

「design-md/stripe/DESIGN.mdを参考に、この仕様に沿ったページを作って」などと依頼します。好みのdesign-md/<name>/DESIGN.mdを確認し、対応するディレクトリをプロジェクトのルートへコピーしてから、エージェントに参照させる流れです。

注意点

自動実行を担うスキルではなく、デザイン資料を提供するリソース集です。制作時はAIエージェントやGoogle Stitchに資料を読み込ませます。ライセンスはMITで、詳細は付属のLICENSEを確認してください。

この紹介文は、公開されている SKILL.md をもとに AI(OpenAI Codex)が作成しました。正確な仕様は下の原文を確認してください。

含まれるファイル(154)

  • SKILL.md2.9 KB
  • .github/FUNDING.yml66 B
  • .github/ISSUE_TEMPLATE/design-md-request.yml1.3 KB
  • .gitignore10 B
  • CONTRIBUTING.md912 B
  • design-md/airbnb/DESIGN.md29.8 KB
  • design-md/airbnb/README.md209 B
  • design-md/airtable/DESIGN.md34.4 KB
  • design-md/airtable/README.md213 B
  • design-md/apple/DESIGN.md36.2 KB
  • design-md/apple/README.md207 B
  • design-md/binance/DESIGN.md39.0 KB
  • design-md/binance/README.md211 B
  • design-md/bmw-m/DESIGN.md30.0 KB
  • design-md/bmw-m/README.md207 B
  • design-md/bmw/DESIGN.md27.3 KB
  • design-md/bmw/README.md203 B
  • design-md/bugatti/DESIGN.md27.9 KB
  • design-md/bugatti/README.md211 B
  • design-md/cal/DESIGN.md30.4 KB
  • design-md/cal/README.md203 B
  • design-md/claude/DESIGN.md32.8 KB
  • design-md/claude/README.md209 B
  • design-md/clay/DESIGN.md25.1 KB
  • design-md/clay/README.md205 B
  • design-md/clickhouse/DESIGN.md25.4 KB
  • design-md/clickhouse/README.md217 B
  • design-md/cohere/DESIGN.md19.6 KB
  • design-md/cohere/README.md209 B
  • design-md/coinbase/DESIGN.md25.2 KB
  • design-md/coinbase/README.md213 B
  • design-md/composio/DESIGN.md20.1 KB
  • design-md/composio/README.md213 B
  • design-md/cursor/DESIGN.md21.3 KB
  • design-md/cursor/README.md209 B
  • design-md/dell-1996/DESIGN.md33.8 KB
  • design-md/dell-1996/README.md217 B
  • design-md/elevenlabs/DESIGN.md20.5 KB
  • design-md/elevenlabs/README.md217 B
  • design-md/expo/DESIGN.md21.2 KB
  • design-md/expo/README.md205 B
  • design-md/ferrari/DESIGN.md23.8 KB
  • design-md/ferrari/README.md211 B
  • design-md/figma/DESIGN.md31.6 KB
  • design-md/figma/README.md207 B
  • design-md/framer/DESIGN.md28.4 KB
  • design-md/framer/README.md209 B
  • design-md/hashicorp/DESIGN.md27.4 KB
  • design-md/hashicorp/README.md215 B
  • design-md/hp/DESIGN.md35.5 KB
  • design-md/hp/README.md201 B
  • design-md/ibm/DESIGN.md25.9 KB
  • design-md/ibm/README.md203 B
  • design-md/intercom/DESIGN.md22.7 KB
  • design-md/intercom/README.md213 B
  • design-md/kraken/DESIGN.md4.2 KB
  • design-md/kraken/README.md209 B
  • design-md/lamborghini/DESIGN.md20.6 KB
  • design-md/lamborghini/README.md219 B
  • design-md/linear.app/DESIGN.md23.8 KB
  • design-md/linear.app/README.md213 B
  • design-md/lovable/DESIGN.md17.0 KB
  • design-md/lovable/README.md211 B
  • design-md/mastercard/DESIGN.md26.4 KB
  • design-md/mastercard/README.md217 B
  • design-md/meta/DESIGN.md37.1 KB
  • design-md/meta/README.md205 B
  • design-md/minimax/DESIGN.md37.0 KB
  • design-md/minimax/README.md211 B
  • design-md/mintlify/DESIGN.md43.0 KB
  • design-md/mintlify/README.md213 B
  • design-md/miro/DESIGN.md35.7 KB
  • design-md/miro/README.md205 B
  • design-md/mistral.ai/DESIGN.md34.7 KB
  • design-md/mistral.ai/README.md217 B
  • design-md/mongodb/DESIGN.md31.3 KB
  • design-md/mongodb/README.md211 B
  • design-md/nike/DESIGN.md35.8 KB
  • design-md/nike/README.md205 B
  • design-md/nintendo-2001/DESIGN.md38.1 KB
  • design-md/nintendo-2001/README.md229 B
  • design-md/notion/DESIGN.md34.4 KB
  • design-md/notion/README.md209 B
  • design-md/nvidia/DESIGN.md34.8 KB
  • design-md/nvidia/README.md209 B
  • design-md/ollama/DESIGN.md32.0 KB
  • design-md/ollama/README.md209 B
  • design-md/opencode.ai/DESIGN.md31.9 KB
  • design-md/opencode.ai/README.md219 B
  • design-md/pinterest/DESIGN.md35.5 KB
  • design-md/pinterest/README.md215 B
  • design-md/playstation/DESIGN.md38.8 KB
  • design-md/playstation/README.md219 B
  • design-md/posthog/DESIGN.md39.5 KB
  • design-md/posthog/README.md211 B
  • design-md/raycast/DESIGN.md40.3 KB
  • design-md/raycast/README.md211 B
  • design-md/renault/DESIGN.md29.4 KB
  • design-md/renault/README.md211 B
  • design-md/replicate/DESIGN.md30.8 KB
  • design-md/replicate/README.md215 B
  • design-md/resend/DESIGN.md30.7 KB
  • design-md/resend/README.md209 B
  • design-md/revolut/DESIGN.md31.3 KB
  • design-md/revolut/README.md211 B
  • design-md/runwayml/DESIGN.md14.0 KB
  • design-md/runwayml/README.md213 B
  • design-md/sanity/DESIGN.md20.7 KB
  • design-md/sanity/README.md209 B
  • design-md/sentry/DESIGN.md34.6 KB
  • design-md/sentry/README.md209 B
  • design-md/shopify/DESIGN.md26.4 KB
  • design-md/shopify/README.md211 B
  • design-md/slack/DESIGN.md24.0 KB
  • design-md/spacex/DESIGN.md19.2 KB
  • design-md/spacex/README.md209 B
  • design-md/spotify/DESIGN.md12.7 KB
  • design-md/spotify/README.md211 B
  • design-md/starbucks/DESIGN.md36.5 KB
  • design-md/starbucks/README.md215 B
  • design-md/stripe/DESIGN.md24.0 KB
  • design-md/stripe/README.md209 B
  • design-md/supabase/DESIGN.md20.8 KB
  • design-md/supabase/README.md213 B
  • design-md/superhuman/DESIGN.md21.4 KB
  • design-md/superhuman/README.md217 B
  • design-md/tesla/DESIGN.md21.7 KB
  • design-md/tesla/README.md207 B
  • design-md/theverge/DESIGN.md27.7 KB
  • design-md/theverge/README.md213 B
  • design-md/together.ai/DESIGN.md37.4 KB
  • design-md/together.ai/README.md219 B
  • design-md/uber/DESIGN.md33.9 KB
  • design-md/uber/README.md205 B
  • design-md/vercel/DESIGN.md40.4 KB
  • design-md/vercel/README.md209 B
  • design-md/vodafone/DESIGN.md27.4 KB
  • design-md/vodafone/README.md213 B
  • design-md/voltagent/DESIGN.md25.3 KB
  • design-md/voltagent/README.md215 B
  • design-md/warp/DESIGN.md23.9 KB
  • design-md/warp/README.md205 B
  • design-md/webflow/DESIGN.md27.5 KB
  • design-md/webflow/README.md211 B
  • design-md/wired/DESIGN.md23.1 KB
  • design-md/wired/README.md207 B
  • design-md/wise/DESIGN.md24.0 KB
  • design-md/wise/README.md205 B
  • design-md/x.ai/DESIGN.md21.3 KB
  • design-md/x.ai/README.md204 B
  • design-md/zapier/DESIGN.md22.5 KB
  • design-md/zapier/README.md209 B
  • LICENSE1.0 KB
  • README.md15.6 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

VoltAgent Awesome DESIGN.md

73 个真实网站的 DESIGN.md 提取集合。 每个子目录(如 design-md/claude/、design-md/stripe/、design-md/tesla/)是一份完整的 DESIGN.md 文件 —— Google Stitch 推广的纯 Markdown 设计系统描述语言。

是什么

DESIGN.md 是 Google Stitch 推出的设计系统规范:

  • AGENTS.md —— 给编码 agent 看,定义"项目怎么建"
  • DESIGN.md —— 给设计 agent 看,定义"UI 应该长什么样"

只需在项目根目录放一份 DESIGN.md,任何 AI 编码 agent / Google Stitch 就能立即理解你的 UI 视觉规范。

怎么用

  1. 浏览 design-md/<name>/DESIGN.md,找一个你喜欢的风格
  2. 复制对应目录到你的项目根目录
  3. 告诉你的 AI agent:"build me a page that looks like this"
  4. AI 会按 DESIGN.md 里的色板 / 字体 / 间距 / 组件规格生成一致 UI

收录分类

  • AI & LLM 平台(Claude / Cohere / ElevenLabs / Mistral AI / Ollama / xAI 等 12 个)
  • Developer Tools & IDEs(Cursor / Expo / Lovable / Raycast / Vercel / Warp 等 7 个)
  • Backend / Database / DevOps(ClickHouse / MongoDB / PostHog / Sentry / Supabase 等 8 个)
  • Productivity & SaaS(Cal.com / Linear / Notion / Resend / Zapier 等 7 个)
  • Design & Creative Tools(Figma / Framer / Miro / Webflow 等 6 个)
  • Fintech & Crypto(Binance / Coinbase / Kraken / Stripe / Wise 等 7 个)
  • E-commerce & Retail(Airbnb / Nike / Shopify / Starbucks 等 5 个)
  • Media & Consumer Tech(Apple / NVIDIA / PlayStation / Spotify / WIRED 等 12 个)
  • Automotive(BMW / Ferrari / Lamborghini / Tesla 等 7 个)
  • Retro Web(1996 Dell / 2001 Nintendo.com 等复古 UI)

总计 73 个 DESIGN.md。

在 Antinet 里的角色

资源目录型 skill —— 不是 agent runtime skill(不进入 SKILL_SOURCES.json 调度),而是设计资源仓库。

前端 skills.html 的 🔥 本周热门 Tab 已收录(与 ip-as-logo / img2threejs / photo-abstract-editorial / anydoc 并列)。

与其他 Skill 的关系

  • ip-as-logo:吉祥物(资产)
  • img2threejs:3D 重建(资产)
  • photo-abstract-editorial:编辑作品(资产)
  • voltagent-awesome-design-md:UI 设计系统(规范)

四者合起来构成"AI 创作素材层"。

License

继承上游仓库 LICENSE。详见 LICENSE 文件(MIT)。

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

コメント

ログインなしで書き込めます。使ってみた感想、質問、動かなかった環境などを気軽にどうぞ。

まだコメントはありません。最初のコメントを書いてみませんか。

送信するとすぐに公開されます。メールアドレスや電話番号などの個人情報は書かないでください。URL は 2 つまでです。

0 / 1000 文字

このフォームは reCAPTCHA で保護されており、Google のプライバシーポリシーと利用規約が適用されます。

同じリポジトリのスキル

agent-team

無料概要あり

複雑な企画や開発に合わせて、実行・進行管理・レビューを担うAIチームを組みます。各役の議論と決定を記録し、共通の情報を使って計画から成果物の作成まで進めます。

  • 技術構成を複数の視点で評価したいとき
  • 市場と費用を踏まえた価格戦略の検討
  • 新製品の実現可能性を調べたいとき
anbeime/skill8,8912026年10月28日 更新

商品紹介役の「小省导购员」の人物画像と背景、合成音声、音楽を生成し、InfiniteTalkと連携して25秒・9:16の縦型動画にまとめるスキル。

  • 25秒の縦型商品紹介動画を作りたいとき
  • 小省导购员の人物参考画像を作りたいとき
  • 動画用のビジネス場面の背景を作りたいとき
anbeime/skill8,8912026年10月28日 更新

antinet-doc-parse

無料概要あり

PDF・Word・Excelなどの文書を構造化Markdownに変換し、メタデータと解析の信頼度を付けて、検索や社内ナレッジの整備に使うスキル。

  • RAG用の文書を整えたいとき
  • 社内ナレッジの文書構造化
  • 契約書からの構造化テキスト抽出
anbeime/skill8,8912026年10月28日 更新

antinet-four-color-cards

無料概要あり

解析済みの文書を事実・解釈・リスク・行動の四色カードに整理し、出典や生成方法をたどりながら、分析内容と次の対応を確認するスキル。

  • 金融レポートの事実と解釈の整理
  • 法律文書の根拠とリスクの確認
  • 研究資料の出典付き分析カード作成
anbeime/skill8,8912026年10月28日 更新

antinet-provenance

無料概要あり

複数のAIエージェントが行った処理を記録し、追跡IDで証拠のつながりを整理します。担当や時間帯で履歴を検索でき、監査や問題発生箇所の特定に役立ちます。

  • エージェント間の処理経路を追いたいとき
  • 時刻や担当で監査記録を検索したいとき
  • ベクトルDB障害中も記録を続けたいとき
anbeime/skill8,8912026年10月28日 更新

antinet-security-scan

無料概要あり

文書や外部URLを取り込む前に、禁止ドメインや文書の利用許諾を確認し、受け入れ可否とリスクの報告書、追跡用IDを出力するスキル。

  • 知識ベースへの文書取り込み前の確認
  • 外部URLの禁止ドメイン照合
  • 処理前の文書利用許諾の確認
anbeime/skill8,8912026年10月28日 更新

anbeime のスキルをすべて見る

このスキルの問題を報告する