Communitygithub.com

AuGa7/unify-ui-pages-skill

Codexスキル:UIデザイン仕様を抽出し、洗練されたメインインターフェースにサブページを統合します。

unify-ui-pages-skill とは?

このスキルは、Codexエージェント向けに設計されており、既存の洗練されたUI(メインインターフェース)からデザイン仕様(色、フォント、間隔、コンポーネント)を自動抽出し、複数のサブページを一貫したスタイルに統一します。開発者は、メインページのスクリーンショットやコードを入力として与えるだけで、スキルがデザインシステムを解析し、他のページ要素を自動調整します。主にCodexプラットフォーム上で動作し、ReactやNext.jsなどのフレームワークに対応。これにより、手動でスタイルガイドを作成したり、各ページを個別に調整する手間を大幅に削減し、プロジェクト全体のUI一貫性を保ちながら開発効率を向上させます。

対応~Claude Code✓Codex CLI~Cursor
npx skills add AuGa7/unify-ui-pages-skill

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

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

ドキュメント

unify-ui-pages-skill は何をしますか?

Codexスキル:UIデザイン仕様を抽出し、洗練されたメインインターフェースにサブページを統合します。

概要

このスキルは、既存の洗練されたメインページのデザインを分析し、そのデザイン仕様(色、タイポグラフィ、スペーシング、コンポーネントスタイル)を抽出します。そして、他のサブページをその仕様に合わせて自動的に調整・統一します。

使用方法

  1. 入力: メインインターフェースのスクリーンショットまたはコードを提供します。
  2. 解析: スキルがデザインシステムを解析し、スタイルガイドを生成します。
  3. 適用: サブページのコードをスキルが更新し、一貫性のあるUIに変換します。

対応プラットフォーム

  • Codex
  • 対応フレームワーク: React, Next.js, Vue.js など

注意事項

  • メインページは十分に洗練された状態である必要があります。
  • サブページのコードはスキルにより上書きされる可能性があります。
  • 事前にバックアップを取ることを推奨します。

関連スキル