mcpField
H
housestyle

housestyle

ローカル
github.com/myanptl開発ツール06 日前に更新
リポジトリ

housestyle について

housestyleは、AIが作成したインターフェースのCSS設計を監査し、改善するためのMCPサーバーです。よくある視覚パターンを見つけ、フォント選定、コントラスト確認、配色、流動的な文字サイズのツールを提供します。

主な機能

  1. 01CSSの汎用的なデザインパターンを監査
  2. 02用途や雰囲気に合わせてフォントと組み合わせを提案
  3. 03WCAGとAPCAのコントラストを確認
  4. 0411段階のOKLCHカラースケールを生成
  5. 05流動的なモジュラー文字サイズを生成

活用シーン

  1. 01AI作成インターフェースのスタイルシートを確認
  2. 02用途や視覚的な雰囲気に合わせたフォント選定
  3. 03ダークテーマのテキストコントラストを評価
  4. 04カラーとタイポグラフィのトークンを作成

MCP 対応

CSS監査やフォント提案、コントラスト確認、パレット生成、文字サイズスケール構築のツールをMCPクライアントに提供します。

設定

ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。

mcp.json · 共通設定
{
  "mcpServers": {
    "myanptl-housestyle": {
      "command": "npx",
      "args": [
        "-y",
        "housestyle-mcp"
      ]
    }
  }
}
起動コマンドnpx -y housestyle-mcp

ローカルサーバーにはマシン上の実行環境（Node.js 18 以上など）が必要です。設定ファイルの場所はクライアントごとに異なります。

パッケージ
npmhousestyle-mcp1.0.2

ツール

6

掲載時のツール一覧 · 2 週間前に更新

パラメーター型必須説明
cssstringはいスタイルシートのテキスト、デザイントークンのブロック、または Tailwind の設定。要約ではなく、実際の内容を貼り付けてください。

詳細

housestyle-mcp

AI が作成したように見える CSS を検出し、フォント、色、コントラストの修正案を提案します。

claude mcp add housestyle -- npx -y housestyle-mcp

MIT ライセンス。

コメント

Markdown 対応

MCP は初めてですか？

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。