uxlint

uxlint

デザインに精通したレビュアーのように、あらゆるウェブサイトのUXを監査します。コントラスト、タップ対象、文字サイズのスケール、色使いの規律、視線の流れ、ランドマークを確認します。各指摘には、エージェント（または人）がそのまま適用できる具体的な修正方法が付属します。コーディングエージェントのループ（MCP）に組み込んで、問題がなくなるまで繰り返し検証できるように設計されています。

最初から最後までの実際の実行例：audit_url → 評価B、コントラスト比2.39:1のエラーと、3種類のアクセントカラーを使った3つのCTA → 修正 → verify_fix → 評価A。表示されている数値はすべてツールから返されたもので、短縮したのは待ち時間だけです。

これはCLIです。小さな単一の静的Rustバイナリで、すでにインストールされているChrome/ChromiumをDevToolsプロトコル経由で操作します（Node、Playwright、ヘッドレスブラウザーのダウンロードは不要です）。ページの見た目や読みやすさをキャプチャして、実際の評価を行うuxlintのホストサーバーに送信します。ルールエンジン、調整済みのしきい値、LLMによる判定はすべてサーバー側にあるため、ルールが変わってもクライアントを更新する必要はありません。

┌──────────────────────────┐        POST /v1/audit {snapshots}        ┌──────────────────────────┐
│ uxlint (this binary)     │ ───────────────────────────────────────▶ │ uxlint-server (hosted)    │
│ drives YOUR Chrome (CDP) │ ◀─────────────────────────────────────── │ rules engine + LLM judge  │
└──────────────────────────┘        report {findings + fixes}         └──────────────────────────┘

インストール

curl -fsSL https://uxlint.net/install.sh | sh    # detects OS/arch, verifies checksum

または、miseを使います。githubバックエンドがGitHub Releasesから対応するビルドを取得して検証し、mise upで更新します。

mise use -g "github:uxlint-net/uxlint-cli[rename_exe=uxlint]@latest"

または、プロジェクトのmise.tomlでバージョンを固定します。

[tools]
"github:uxlint-net/uxlint-cli" = { version = "latest", rename_exe = "uxlint" }

または、ソースからビルドします（最近の安定版Rustツールチェーンと、PATH上のChrome/Chromiumが必要です）。

git clone https://github.com/uxlint-net/uxlint-cli && cd uxlint-cli
cargo build --release
./target/release/uxlint --version

クイックスタート

uxlint auth login                                        # opens your browser, saves a token
uxlint audit --base https://your-site.com --routes /,/pricing

自分のプロジェクトを初めて監査しますか？uxlint initを実行すると、レポートを紐付けるサイトを選択（または作成）し、uxlint.tomlを書き込みます。これにより、今後このディレクトリで実行する監査はすべてそのまま動作します。

uxlint init
uxlint audit --base http://localhost:5173 --routes /,/pricing

設定した重大度を超える指摘がある場合は終了コード1を返します。CIにそのまま組み込めます（テンプレートは.github/workflows/を参照するか、GitHub Actionのuxlint-net/uxlint-actionを使ってください）。

監査対象から要素を除外する（uxlint-hide）

ページ上の一部の装飾要素はプロダクトUIではないため、評価対象にすべきではありません。たとえば、開発環境やステージング環境のバナー、「DEV」マーカー、デバッグツールバー、Storybookやプレビューへのリンクなどです。そのような要素に**uxlint-hide**クラスを追加すると、監査時に要素が取り除かれます。最初の描画からdisplay:noneになるため、スクリーンショットに表示されず、収集ツールにも認識されません（指摘も生成されません）。

<div class="env-banner uxlint-hide">STAGING</div>

このクラスは実際のサイトでは無効です。監査の実行中以外は何もしません。要素を非表示にするスタイルシート（.uxlint-hide { display: none !important; }）はuxlintのブラウザーがページ独自のスクリプトの実行前にのみ挿入するためです。それ以外のときは、要素を自由にスタイル設定できます。クロール、ゴールウォークテスト、修正プレビューなど、すべてのキャプチャ経路で適用されます。

何が変わりますか？（--allow-mutation）

インタラクション監査では、候補となるメニュー、開閉式コンテンツ、ダイアログのコントロールを操作し、読み取り、クリックします。 検出では、アクセシブルネームに認識済みのアクション動詞（delete、remove、accept、 leave、revoke、cancel、transfer、pay、publish、submit、add、create、save とその派生形）が 単語全体としてラベルのどこかに含まれるコントロールをスキップします。ラベルだけではクリックハンドラーの動作を証明できないため、使い捨てデータを用意した、ご自身が管理する環境でインタラクション監査を実行してください。

書き込みを行うプローブは2つあり、どちらも--statesに加えて**--allow-mutation**が必要です。

• action-feedbackプローブは、ページに何かが起きたことを示すメッセージが表示されるか確認するため、作成系アクション（Add / Create / Save）をクリックします。
• destructiveプローブは、破壊的なアクションが最初に確認を求めるか、元に戻す手段を提供するかを確認するため、Delete / Removeをクリックし、確認ダイアログもクリックして進みます。

これらはaction-no-feedback、destructive-no-confirm、undo-missingの各ルールを支えています。このフラグがない場合、この3つのルールは何も報告しません。**使い捨て環境でのみ実行してください。**行を削除する権限を持つユーザーとしてサインインしていることと、削除を依頼したことは同じではありません。このフラグで、そのことを明示します。

uxlint mcpがこのフラグを設定することはなく、設定を求めることもできません。

監査で書き込みを行うもう1つの方法は、ご自身で作成したものです。宣言された[[tests]]のウォークでは、ペルソナとしてサインインし、実際のフローを実行します。これがテストの役割です。

MCP（コーディングエージェントから使用）

Claude Codeなら、コマンド1つ：

/plugin marketplace add uxlint-net/uxlint-cli
/plugin install uxlint@uxlint

これによりuxlint MCP サーバーがインストールされ、CLIがまだPATHにない場合は、上記と同じチェックサム検証付きインストーラーを使って対応するバージョンが一度だけ取得されます。そのため、/plugin updateでCLIも更新されます。Nodeは不要です。静的バイナリを1つダウンロードし（公開済みチェックサムと照合して検証）、すでにお使いのChromeを操作します。

その他のエージェント — 1行で設定できます（npmパッケージがご利用のプラットフォーム用のバイナリを取得し、併記されている公開チェックサムを検証して、引き渡します）。この方法だけは、npx自体を使うため**Node 18+**が必要です。Nodeを使いたくない場合は、冒頭の行でバイナリをインストールし、それを登録してください。

claude mcp add uxlint -- npx -y @uxlint-net/uxlint mcp

JSON設定を読み込むクライアントの場合：

{ "mcpServers": { "uxlint": { "command": "npx", "args": ["-y", "@uxlint-net/uxlint", "mcp"] } } }

uxlintはMCP Registryにもio.github.uxlint-net/uxlintとして登録されており、そこから検索できるクライアントで利用できます。すでにCLIをお持ちの場合は、uxlint mcp installでnpxラッパーを介さずに直接登録できます。

事前に設定するトークンはありません。サインアウトした状態で何かを監査するようエージェントに依頼すると、トークンを発行して保存するサインインリンクが表示されます（UXLINT_API_KEYは、ブラウザーのないCI用です）。

ツールは5つあります。audit_url（監査全体、評価付きの判定＋アクションプラン）、verify_fix（編集後、1つのページで1つのルールを再確認）、get_shot（検出結果の注釈付きスクリーンショットを取得）、ux_guidance（UIの構築前に読むベストプラクティスガイダンス）、lint_feedback（オプトインで、デフォルトでは無効。3種類のフィードバックを1つのツールで送信：検出結果が役立ったか、uxlintに不足しているlint、または認識できなかったコンポーネントライブラリ）。エージェントは監査し、修正内容を読み、編集し、合格するまで再監査します。

検証とデザインメモリ

verify_fix は passed、failed、not_evaluated、inconclusive のいずれかを返します。検出結果がゼロというだけでは、修正に合格したことにはなりません。現在、合格と判定できる検証は page-title-missing、html-lang-missing、horizontal-overflow を対象とし、要求されたルートと両方のビューポートについて明示的なエビデンスを必要とします。その他のチェックでは失敗を報告できますが、完全な監査とエビデンスの確認が必要です。不明なルール、スキップされたチェック、古いサーバーは合格と判定できません。チェックが解消されても、自動的に承認票が送信されることはありません。

承認済みのプロジェクト上の決定は、uxlint.toml と同じ場所にある uxlint.design.json に保存してください。ux_guidance は、新しいエージェントセッションも含め、実行のたびにこのファイルを新たに読み込みます。まずはドラフトを作成します。

{"version":1,"revision":1,"status":"draft","site":"example.test",
 "tokens":{"accent":"var(--color-brand)"},
 "components":{"primary_action":"Reuse PrimaryButton"},
 "pages":{"/":"Explain the product and offer a clear starting action"},
 "journeys":["Start the main task from the homepage"],
 "references":["/styleguide"],"exceptions":[]}

site には、プロジェクトで設定されているサイトを指定してください。status を approved に設定してファイルをコミットする前に、オーナーと決定事項を確認してください。その後、承認済みの変更を加えるたびに revision をインクリメントしてください。このツールが契約を承認したり、書き込んだりすることはありません。ドラフトがガイダンスになることもありません。参照先を自動取得することはなく、例外によってリントが抑制されることもありません。また、この初期のローカルメモリは、まだトークンを強制したりスクリーンショットを比較したりしません。無効な契約は、警告として表示されます。ファイルは 32 KiB 未満に保ち、認証情報や顧客の非公開データを記載しないでください。

プライバシーと信頼

この CLI はお使いのマシン上で動作し、実際のブラウザーを操作して実際のページにアクセスするため、具体的に何を取得し、どこに送信するのかを知りたいと思うのは当然です。以下は、このリポジトリのコードが実際に行っていることとしてお伝えできる内容です。

• コレクターはバイナリに組み込まれており、内容を確認できます。 このバイナリには assets/collector.js が include_str! によってコンパイル時に組み込まれるため、uxlint --version で取得コードを正確に特定でき、サーバーが実行時に何かを注入することはできません。取得されるのはすべて、ページのジオメトリ、表示テキスト、計算済みスタイル、スクリーンショットです。埋め込みの <iframe> について記録されるのは src のホストのみです。クエリ文字列にセッション ID やトークンが含まれる可能性のある埋め込み URL 全体が記録されることはありません。ソースコードや uxlint.toml 以外のファイルシステムを読み取ることもありません。一方、プロジェクトの来歴情報を少し読み取り、レポートとともに送信します。具体的には、現在の git コミット SHA とブランチ名（git rev-parse）、マシンのホスト名、そして GitHub Actions ではリポジトリ／PR／コミットへのリンクです。ホスト名を上書きするには UXLINT_RUNNER を設定してください。
• シークレットと PII のマスキングはベストエフォートであり、保証されるものではありません。 アップロード前に、コレクターは取得したページテキストのうち、トークン、API キー、パスワード、メールアドレスのように見えるテキストをマスキングし、コンソールログとネイティブダイアログのメッセージからも同じパターンを削除します。すべての経路で同一のパターンリスト（assets/redact.js）を使用するため、パターンがばらつくことはありません。スクリーンショットには、撮影の直前に追加の処理を行います。すべてのフォームフィールドの値をマスキングし（パスワードは空欄にし、その他の入力値はドットに置き換えます）、ページ上のテキストに含まれるパターン一致したシークレットを削除するため、入力したデータや表示されたキーが画像に残ることはありません。この処理はシャドウ DOM（attachShadow インターセプターを介してクローズドなルートを含む）と同一オリジンの iframe にも適用されます。また、クロスオリジンの iframe はピクセルをマスキングできないため、不透明なボックスで覆います。ただし、マスキングはパターンに基づくものであり、スクリーンショットにはピクセルが残ります。そのため、どのパターンにも一致しない任意の表示内容（ページ上の顧客名、注文データ）、分割された値、画像や <canvas> に描画された内容は、漏れる可能性があります。--header／--storage／--login-* で渡す認証情報はお使いのブラウザーの操作にのみ使われ、uxlint のサーバーに送信されることはありません。

  レポートにはページの HTML、テキスト、スクリーンショットが含まれるため、機密情報の漏えいを完全に防ぐことはできません。実際のアカウントや本番アカウントではなく、テストアカウントを使用してください。 ローカル開発では、データがローカル開発用のものだけであれば、リスクは低いです。実際のシークレットや個人データを保持する認証済みサイトを監査する場合は、送信前に送信内容を確認してください。--dry-run を使うと、正確なペイロード（ページのテキスト、来歴、スクリーンショット）がローカルフォルダーに書き込まれるため、アップロードせずに内容を確認できます。マスキングは偶発的な漏えいを減らしますが、セキュリティ上の境界ではありません。uxlint の対象に何を指定するかは、引き続きお客様の責任です。

• ナビゲーション用テキストは、意図的にシークレットのみを除去します。 コントロールのラベル、メニューや <select> の選択肢、ワークスペース／組織切り替えメニューの名前には、同じシークレットパターンが適用されますが、名前やその他の任意の内容はマスキングされません。これはゴールウォークのためです。監査では LLM がページを操作し、まさにこのテキストを読み取って適切なコントロールを見つけ、操作し、その選択内容を DOM と照合します。マスキングすると、判定側が 2 つの選択肢を区別できなくなったり、選んだ選択肢をクリックできなくなったりするため、ゴールウォークが成立しなくなります。そのため、監査で必要なラベルは読み取れる状態にし、ラベルに含まれる実名についてはマスキングではなく、前述のテストアカウントのルールで保護します。これは意図的なトレードオフです。ゴールウォークを機能させることは、テストアカウントのルールですでに保護されているテキストを空白にすることより重要です。
• テレメトリーはありません。 このバイナリが外部へ接続するのは、指定されたホストだけです。uxlint API サーバー（--server／UXLINT_SERVER、またはデフォルトのホスト先）、監査対象として指定したサイト、そして明示的にオプトインした場合に限り、匿名のルールフィードバック信号です。別の分析／クラッシュレポート／ホームへの通信先が組み込まれていることはありません。
• フィードバックはオプトインで、デフォルトではオフです。 uxlint init は一度だけ確認します。「はい」と答えた場合に限り、uxlint.toml に feedback = true を書き込みます。いつでも設定を元に戻せます。
• 監査ブラウザーは一時的なプロファイルを使用します。 監査を実行するたびに、Chrome は新しい使い捨てのユーザーデータディレクトリで起動します。そのため、普段のブラウジングで使っている Cookie、履歴、拡張機能が監査セッションに読み込まれることはなく、プロセスの終了後にデータが残ることもありません。
• ログイン情報はローカルに保管されます。 uxlint auth login はトークンを ~/.config/uxlint/credentials に保存し、パーミッションを 0600 に設定します。トークンがログに記録されたり、表示されたりすることはありません（意図的な例外が 1 つあり、uxlint signup は新しく生成したキーを出力するため、エクスポートできます）。レポートに含まれることもありません。

これはソースを読むことの代わりにはなりません。ソースは短く、それこそが公開した理由です。この説明と一致しない点を見つけた場合は、issue を作成してください。

この CLI が 対象としないこと

この CLI は意図的にシンプルです。ナビゲーションし、組み込みのコレクターを実行し、スナップショットをアップロードし、レポートを表示します。ルール、しきい値、判定モデルはこのリポジトリにはなく、今後も追加されません。それらこそが実際の製品であり、サーバー側だけに存在します。この CLI のビルドは、接続先となる uxlint サーバー（デフォルトの https://uxlint.net、または独自のサーバー）がなければ役に立ちません。

ライセンス

Apache License 2.0（LICENSE を参照）。読んだり、監査したり、フォークしたり、ソースからビルドしたり、ご自身のツールに組み込んで配布したりできます。通常の著作権表示と特許に関する条項以外に条件はありません。

以前は Business Source License でしたが、2030 年の変更日に Apache-2.0 に切り替わる予定でした。単にその時期が早まっただけです。このライセンスに含まれていた制限、つまり、このコードを使って競合するホスト型の「自分のサイトを監査」サービスを構築することを禁じる制限は、守る対象を取り違えていました。価値があるのはルール、調整されたしきい値、判定役であり、これらはサーバー側にあって、このリポジトリにはありません。ここにあるのは uxlint サーバーがなければ何の役にも立たないクライアントです。そして、クライアントこそ、手間なくインストールし、読み込み、ベンダーとして取り込めるべきものです。

v0.1.30 までのリリースは BUSL-1.1 のもとで公開されており、v0.1.31 以降は Apache-2.0 です。