·design-guide
*

design-guide

mosif16/codex-skills

SwiftUI、Android、Web プラットフォーム全体で最新のプロフェッショナルな UI デザインを保証します。ボタン、フォーム、カード、レイアウト、ナビゲーション、完全な画面などのユーザー インターフェイス コンポーネントを構築するときに使用します。クリーンなミニマルデザイン、1 つのアクセントカラーを含むニュートラルカラーパレット、8 ピクセルのグリッド間隔システム、適切なタイポグラフィ階層、明確なインタラクティブ状態を強制します。 UI 要素を作成または変更する前に必ず参照してください。

23インストール·0トレンド·@mosif16

インストール

$npx skills add https://github.com/mosif16/codex-skills --skill design-guide

SKILL.md

Comprehensive design system ensuring every UI you build looks modern, professional, and consistent across all platforms (SwiftUI, Android Studio, web applications).

Spacing: 8, 16, 24, 32, 48, 64px Typography: 16px minimum body, max 2 fonts Colors: Neutral base + ONE accent Shadows: Subtle only Border radius: 6-12px most elements Interactive states: Always include hover, active, disabled, focus

Always reference this guide before creating any UI component. Consistency is key to professional design.

SwiftUI、Android、Web プラットフォーム全体で最新のプロフェッショナルな UI デザインを保証します。ボタン、フォーム、カード、レイアウト、ナビゲーション、完全な画面などのユーザー インターフェイス コンポーネントを構築するときに使用します。クリーンなミニマルデザイン、1 つのアクセントカラーを含むニュートラルカラーパレット、8 ピクセルのグリッド間隔システム、適切なタイポグラフィ階層、明確なインタラクティブ状態を強制します。 UI 要素を作成または変更する前に必ず参照してください。 ソース: mosif16/codex-skills。

原文を見る

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/mosif16/codex-skills --skill design-guide
カテゴリ
*クリエイティブ
認証済み
初回登録
2026-02-01
更新日
2026-02-18

クイックアンサー

design-guide とは?

SwiftUI、Android、Web プラットフォーム全体で最新のプロフェッショナルな UI デザインを保証します。ボタン、フォーム、カード、レイアウト、ナビゲーション、完全な画面などのユーザー インターフェイス コンポーネントを構築するときに使用します。クリーンなミニマルデザイン、1 つのアクセントカラーを含むニュートラルカラーパレット、8 ピクセルのグリッド間隔システム、適切なタイポグラフィ階層、明確なインタラクティブ状態を強制します。 UI 要素を作成または変更する前に必ず参照してください。 ソース: mosif16/codex-skills。

design-guide のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/mosif16/codex-skills --skill design-guide インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/mosif16/codex-skills