Communitygithub.com

MonkeyUI-dev/vibe-to-ui

バイブスコーダーのためのデザインコンパニオン。プロジェクトを深く理解し、毎回改善されます。

vibe-to-ui とは?

MonkeyUI-dev/vibe-to-uiは、AIエージェント(Claude Code、Cursor、Codexなど)と連携して動作するデザインアシスタントスキルです。このスキルは、プロジェクトの構造やスタイルガイドを学習・記憶し、開発者がUIコンポーネントやデザイン要素を生成する際に、プロジェクトの一貫性を保ちながら効率的に作業できるように支援します。主な特徴として、プロジェクト固有のデザインパターンを自動的に認識し、それに基づいてコードやデザインの提案を行います。これにより、開発者は手動でスタイルガイドを参照したり、過去のデザイン決定を覚えておく必要がなくなります。対応プラットフォームはClaude Code、Cursor、Codexなど、主要なAIコーディングエージェントをサポートしています。このスキルは、プロジェクトのコードベースを解析し、コンポーネントの命名規則、カラーパレット、タイポグラフィ、レイアウトパターンなどを学習します。学習した情報はプロジェクトコンテキストとして保存され、新しいUI要素の生成や既存のコンポーネントの修正時に参照されます。結果として、生成されるUIコードはプロジェクトの既存のデザインシステムと自然に調和し、開発者はより一貫性のあるユーザーインターフェースを迅速に構築できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add MonkeyUI-dev/vibe-to-ui

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

vibe-to-ui は何をしますか?

バイブスコーダーのためのデザインコンパニオン。プロジェクトを深く理解し、毎回改善されます。

関連スキル