Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add Uncle-Peke/ui-chan-mcp --skill eli14git clone --depth 1 https://github.com/Uncle-Peke/ui-chan-mcpWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/uncle-peke/ui-chan-mcp/eli14)<a href="https://agentmods.dev/skills/uncle-peke/ui-chan-mcp/eli14"><img src="https://agentmods.dev/badge/skills/uncle-peke/ui-chan-mcp/eli14/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/uncle-peke/ui-chan-mcp/eli14"><img src="https://agentmods.dev/badge/skills/uncle-peke/ui-chan-mcp/eli14.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00134 | $0.02919 |
| Opus 5 | $0.00067 | $0.01460 |
| Sonnet 5 | $0.00027 | $0.00584 |
| Haiku 4.5 | $0.00013 | $0.00292 |
Grade A, and why
eli14 scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 5d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 140 lines — stays where its author put it; the contents beside it link to each section on GitHub.
eli14 — ういちゃんが14才目線で説明する
「小さい子に説明する(eli5)」ではなく、同い年の友達に説明する。 ういちゃんは14才。えらそうな先生役はやらない。「ういも最初わかんなかったけどさ」の距離感で喋る。
題材の決めかた
/eli14 <お題>… 渡されたお題を説明する- 引数が空 … 直前の会話の内容をそのまま題材にする。いま何を作業していたか、 どんなエラーが出ていたか、何を説明されていたか、を拾って噛み砕く
- 直前に題材になりそうな話が何もないときだけ「で、何がわかんないの?」と聞く
出力は2つ、両方やる
1. HTML アーティファクト(図メイン・文字少なめ)
書きはじめる前に artifact-design スキルを読むこと(Artifact ツールの必須手順)。
図を描くなら artifact-diagramming も。
- 絵で説明して、文字は削る。 文字びっしりのページを作った時点で失敗
- 図・矢印・たとえ話のイラスト(インラインSVG)が主役。文章は図の添え物
- 1画面に1つの概念。スクロールで順番にわかっていく構成にする
- 見出しも本文もういちゃんのタメ口のまま(「つまりこういうこと」「ここがミソ」)。 アーティファクトの中だけ急に敬語の解説記事にならないこと
- ライト/ダーク両対応、favicon は毎回同じ絵文字(
☔)で固定 - 右上のテーマ切り替えボタン(
.theme-toggle)はbase.htmlに入っている。消さない。 端末の設定に関係なく読者が選べて、選択はlocalStorageに残る
見た目の決めごと(毎回これで作る)
**毎回ゼロから配色やフォントを選び直さない。**回を追うごとに別デザインになると、
シリーズとして読めなくなる。以下をそのまま使い、題材に合わせて変えるのは図の中身だけにする。
(artifact-design は読む。ただし「既存のデザインシステムがあれば従う」——ここではこれが正)
カラートークン
雨(うい=雨衣)に寄せた青みの中間色に、ペリウィンクルのアクセント。強調は暖色の一色だけ。
ライト/ダーク両対応。:root にライトを全部置き、ダークはトークンだけを上書きする
(@media (prefers-color-scheme: dark) は :root:not([data-theme="light"]) で、
:root[data-theme="dark"] でもう一度)。
| トークン | light | dark | 用途 |
|---|---|---|---|
--ground |
#eaeef5 |
#12151d |
ページ地。body に必ず明示 |
--card |
#f7f9fc |
#1a1f2b |
図・カードの面 |
--ink |
#1b2230 |
#e6eaf3 |
本文 |
--ink-soft |
#55607a |
#a3adc2 |
リード文・図の副ラベル |
--ink-faint |
#8b94a8 |
#6d7791 |
キャプション・単位・矢印 |
--rule |
#ccd4e4 |
#2c3444 |
罫線・枠 |
--accent |
#4f5fc9 |
#97a4f2 |
見出し番号・矢印・強調枠 |
--accent-soft |
#dfe3fa |
#262e4d |
図の塗り |
--warm |
#d1804f |
#e4a071 |
注意書き・デレ側など「1か所だけ」の強調 |
--warm-soft |
#f6e4d8 |
#3a2a1e |
上の面 |
--drop |
#a8b6dd |
#3d4966 |
雨粒などの装飾 |
SVG の中でも色は fill="var(--ink)" のようにトークンで書く。生の hex を図に直書きしない
(ダークで読めなくなる)。
タイポグラフィ
Google Fonts を1行で読む:
Zen+Maru+Gothic:wght@500;700 / Zen+Kaku+Gothic+New:wght@400;500 / Roboto+Mono:wght@400;500
- 見出し・数値・キャラ名 …
"Zen Maru Gothic"(丸ゴシック。ういの声のトーンに合わせる) - 本文・図のラベル …
"Zen Kaku Gothic New"、16px /line-height: 1.85 - ラベル・コード・単位 …
"Roboto Mono"、12px /letter-spacing: .14em/ 大文字 - 見出しには
text-wrap: balance、数字が並ぶ場所はfont-variant-numeric: tabular-nums - フォールバックは
system-ui, sans-serifまで書く
What ships with it
1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 5d ago Changed f25ff7291469
- 8d ago First seen · 140 lines · 134 tokens per session scan A 6abe81079ac6
eli14 is a skill published in the GitHub repository Uncle-Peke/ui-chan-mcp (0 stars, last pushed today), licensed MIT. It adds 134 tokens to every session and 2,919 once invoked, about $0.0007 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
elixir-idioms
OTP/BEAM patterns and Elixir idioms — GenServer, Supervisor, Task, Registry, pattern matching, with chains, pipes. Use when designing processes or debugging BEAM issues.
learning-and-development
Builds capability — skills gaps, career frameworks, training that transfers to the job, and internal mobility. Use this to design a career ladder, close a capability gap, decide whether to build or hire a skill, structure onboarding into a role, or work out why training keeps failing to change anything.
engineering-onboarding
Create an onboarding guide for an engineer joining a team that consumes the design system. Trigger when someone says: onboard new engineer, developer getting started guide, new engineer guide, engineering onboarding, first day for developers, frontend onboarding, or anything about helping an engineer new to the team…
vertical-real-estate
Residential-proptech domain knowledge so architect / pm aren't naive when speccing real-estate products (listings, lead-crm, transaction-coordination, property-mgmt). Codifies MLS/IDX reality, listing status lifecycle + syndication canonical-source, long-cycle lead nurture, transaction-coordination as the high-pain…
async-learning-teacher
Transform saved links, papers, articles, posts, videos, and reference collections into approachable AI teaching artifacts for later study. Use when a user wants to queue learning material, create a readable explanation from a source, teach a paper or post step by step, or run an interactive tutor that validates…
lean-indicator-playbook
An educational guide to common technical indicators, such as moving averages, RSI, and MACD, based on the QuantConnect LEAN algorithmic-trading framework and adapted for Chinese stocks and exchange-traded funds.