How do I install the Tsubotax Melta UI Melta UI skill?

Run npx skillmds@latest add tomevault-io/tsubotax-melta-ui-melta-ui in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

What does the Tsubotax Melta UI Melta UI skill do?

デザインレビュー It is listed under Coding & Dev Tools on SkillMD.

Is Tsubotax Melta UI Melta UI safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Tsubotax Melta UI Melta UI?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Tsubotax Melta UI Melta UI free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Tsubotax Melta UI Melta UI?

tomevault-io (@tomevault-io) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Tsubotax Melta UI Melta UI by tomevault-io

Name: Tsubotax Melta UI Melta UI
Author: tomevault-io

File contents

デザインレビュー

HTMLファイルを melta UI デザインシステム（CLAUDE.md + foundations/prohibited.md）に照らしてレビューし、違反を検出・分類・修正提案する。

手順

Step 1: 対象のHTMLファイルを特定する

引数でファイルパスが指定されている場合 → そのファイルを読み込む
引数がない場合 → examples/ 配下のHTMLファイルを一覧表示し、ユーザーに選択してもらう
対象がHTMLファイルでない場合 → 「HTMLファイルを指定してください」と返す

対象ファイルを全文読み込む。

Step 2: DSリファレンスを読む

以下を読み込む:

CLAUDE.md（クイックリファレンス・禁止パターン要約）
foundations/prohibited.md（全禁止パターン — SSOT）

Step 3: チェックリストに沿って違反を検出する

references/checklist.md を読み込み、以下のカテゴリ順にHTMLを走査する:

カラー
スペーシング・レイアウト
タイポグラフィ
モーション
ボーダー
フォーム（fieldset/legend カード干渉、日付セレクト幅を含む）
アクセシビリティ

Step 4: 偽陽性を排除し、重大度を判定する

references/severity-rules.md を読み込み、以下を実行:

「推奨」と「必須」を区別 — 推奨事項は違反として報告しない
文脈判定で偽陽性を排除 — label/aria-current/text-xs の文脈確認
重大度を割り当て — Critical / High / Medium / Low の4段階。固定ルールに従う

Step 5: レポートを出力する

references/report-template.md を読み込み、テンプレートに沿ってレポートを出力する。

出力前に サマリー整合チェック を実施: 本文中の各重大度の件数と冒頭サマリーの件数が一致することを確認する。

Source: tsubotax/melta-ui — distributed by TomeVault.

---name: tsubotax-melta-ui-melta-uidescription: デザインレビュー---# デザインレビューHTMLファイルを melta UI デザインシステム（CLAUDE.md + foundations/prohibited.md）に照らしてレビューし、違反を検出・分類・修正提案する。## 手順### Step 1: 対象のHTMLファイルを特定する- 引数でファイルパスが指定されている場合 → そのファイルを読み込む- 引数がない場合 → `examples/` 配下のHTMLファイルを一覧表示し、ユーザーに選択してもらう- 対象がHTMLファイルでない場合 → 「HTMLファイルを指定してください」と返す対象ファイルを全文読み込む。### Step 2: DSリファレンスを読む以下を読み込む:- `CLAUDE.md`（クイックリファレンス・禁止パターン要約）- `foundations/prohibited.md`（全禁止パターン — SSOT）### Step 3: チェックリストに沿って違反を検出する`references/checklist.md` を読み込み、以下のカテゴリ順にHTMLを走査する:1. カラー2. スペーシング・レイアウト3. タイポグラフィ4. モーション5. ボーダー6. フォーム（fieldset/legend カード干渉、日付セレクト幅を含む）7. アクセシビリティ### Step 4: 偽陽性を排除し、重大度を判定する`references/severity-rules.md` を読み込み、以下を実行:1. **「推奨」と「必須」を区別** — 推奨事項は違反として報告しない2. **文脈判定で偽陽性を排除** — label/aria-current/text-xs の文脈確認3. **重大度を割り当て** — Critical / High / Medium / Low の4段階。固定ルールに従う### Step 5: レポートを出力する`references/report-template.md` を読み込み、テンプレートに沿ってレポートを出力する。出力前に **サマリー整合チェック** を実施: 本文中の各重大度の件数と冒頭サマリーの件数が一致することを確認する。---> Source: [tsubotax/melta-ui](https://github.com/tsubotax/melta-ui) — distributed by [TomeVault](https://tomevault.io).

Frequently asked questions

Tsubotax Melta UI Melta UI