frontend-design-fix-vue

このClaudeスキルは、タイポグラフィ、カラー、モーション、空間構成、背景にわたる美的アップグレードを適用することで、汎用的なReactコンポーネントのデザインを自動的に改善します。既存のコンポーネントを分析して無個性なパターンを特定し、Anthropicのデザインフレームワークを使用して体系的に強化します。手動でのデザイン作業なしに、基本的なReact UIを視覚的に特徴的なインターフェースに素早く変換する必要がある場合に、このスキルをご利用ください。

このスキルは、一般的なHTML/CSSデザインを、タイポグラフィ、色彩、動き、空間構成、背景にわたって美的アップグレードを適用することで変換します。既存のコードを分析して無個性なパターンを特定し、Anthropicのデザインフレームワークを使用して体系的にそれらを強化します。基本的なフロントエンドデザインを、視覚的に特徴的なインターフェースへと素早く昇華させる必要がある場合にご利用ください。

このスキルは、タイポグラフィ、色彩、モーション、空間構成、背景の5つの主要領域にわたって美的改善を適用することで、汎用的なSvelteコンポーネントのデザインを自動的にアップグレードします。既存のコンポーネントを分析し、デザイン上のアンチパターンを特定し、それらを視覚的に特徴的なインターフェースへと体系的に変換します。プロジェクト内の無個性なSvelteコンポーネントの視覚的魅力を素早く高めたい場合にご利用ください。

このスキルは、Content Collections（Markdown/MDXファイルを型安全なデータコレクションに変換するTypeScriptファーストのツール）の本番環境でテストされた設定を提供します。Zodバリデーションによる型安全性を実現し、ブログ、ドキュメントサイト、コンテンツ重視のVite + Reactアプリケーション構築時にご利用ください。Viteプラグインの設定、MDXコンパイルから、デプロイ最適化、スキーマバリデーションまで、すべてを網羅しています。