canon

A design-planning guide that chooses a product's visual language and measurable targets before implementation begins. It acts as the organizing principle for later decisions about color, type, layout, form, graphics, and motion.

In plain words
What is it for?
Use it before placing pixels to create a design-language brief, quantified targets, and a product-sense check for the rest of the frontend build.
Why use it?
It prevents a design from emerging through small, unrelated adjustments that look acceptable individually but lack a coherent direction.

Skill for Claude CodeCodex

Install

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.

agentmods
npx agentmods add skills/iamk77/skill/canon
Any agent
npx skills add IamK77/Skill --skill canon
Clone the repo
git clone --depth 1 https://github.com/IamK77/Skill

Made for: Claude Code, Codex.

Per session 197 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 5,204 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5 $0.00197 $0.05204
Opus 5 $0.00098 $0.02602
Sonnet 5 $0.00039 $0.01041
Haiku 4.5 $0.00020 $0.00520

Measured 2d ago against content hash 4629215c7181, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

canon 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 2d ago.

The scan reads SKILL.md. This mod also ships 2 executable files (probes/ai-default.mjs, probes/test.mjs), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

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.

skills/atelier/canon/SKILL.md · 144 lines

How it starts

The opening of the file, as written. The whole thing — 144 lines — stays where its author put it; the contents beside it link to each section on GitHub.

canon

!checklist init ${CLAUDE_SKILL_DIR} --force

A canon is the underlying measure from which a craftsman's proportions derive — not a style applied after, but the organizing principle that makes every dimension coherent before a single mark lands. canon is the judgment spine of the atelier suite: where a frontend build has bearings to fix the boundaries before the first line of code, a design build has canon to fix the design language before the first visual value. Its product is three one-page artifacts — a design-language brief, a quantified-targets sheet, and a product-sense check — that every later lens (color, type, layout, form, graphics, motion) honors. It runs across gated stages and will not advance past a GATE until the checklist tool clears it. The gate enforces order; the substance of every judgment inside it is yours.

The governing fact: high-craft design is not defaults nudged until "ok" — it is a small set of NON-DEFAULT, QUANTIFIED decisions made before any pixel, all derived from one upstream choice: the surface's point of view. Style is derived from that point of view (POV → style); the agent's signature failure is to run it backwards — reach for a premium-looking style first and reverse-justify it — which is exactly how it lands in the default mean. An agent without guidance converges to three statistical defaults: the warm-cream editorial (off-white ground, high-contrast serif, ochre accent); the near-black neon tool (single fluorescent accent, zero radius, dense grid); the newspaper grid (hairlines, dense columns, pure neutrals). These are not choices — they are the agent's aesthetic gravity, the modal outputs of its training. None of them is wrong in principle; each is wrong as a default, because it was never decided. The craft move is to name the organizing principle first — which visual language, which archetype, what this surface is for — and then derive every subsequent call from that decision rather than from the agent's statistical center of mass.

This is where the agent era bites:

  • The agent picks plausible-but-unconsidered values and feels no wrongness. It emits a warm-cream serif because that combination is overrepresented in high-engagement design content, not because it fits your surface. It reaches for rounded corners and drop shadows because those are the defaults of the popular component libraries it has seen, not because they serve your user's cognitive load. It has no nervous system to feel that a dashboard with editorial-weight type is wrong in kind, not just aesthetically suboptimal.
  • The agent defaults to decoration over decision. It adds gradients, shadows, and micro-animations because they pattern-match to "polished" in its training — but "polished" on a marketing surface and "polished" on a dense data tool are entirely different objects. Motion that signals craft on a landing page is noise on a trading terminal. The agent cannot make this distinction without being told the archetype.
  • The agent cannot quantify taste. It will say "high contrast" without a number, "generous spacing" without a scale, "minimal motion" without a budget. The non-default choice must be a number — a contrast floor, a density grade, a type-scale ratio — or it will dissolve into the next prompt.

Read references/non-default-and-quantified.md first — this skill's spine; the encodable techniques for taking each aesthetic dimension from "default" to "decided and measured." Then read references/surface-archetypes.md to ground the language choice in what the surface is for. The product-sense reference opens at STAGE 2.

Cross-suite lineage. canon is to atelier what bearings is to surface — the spine that fixes the irreversible early decisions before sunk cost accrues. bearings asks: which boundary, which source of truth, whose mental model? canon asks: which visual language, which archetype, what does premium mean here? They share a governing insight: the agent writes the code / pixels competently; the leverage lives in the calls it cannot make — the ones that require taste, context, and a nervous system.

Read the full file on GitHub · 144 lines

Files

What ships with it

10 files 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.

Changes

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.

  1. 2d ago First seen · 144 lines · 197 tokens per session scan A 4629215c7181

Subscribe to this mod's changes

canon is a skill published in the GitHub repository IamK77/Skill (2 stars, last pushed 1mo ago), licensed Apache-2.0. It adds 197 tokens to every session and 5,204 once invoked, about $0.0010 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.

Related

Other skills, from other repositories

agent-platform-model-registry

Agent Platform Model Registry Management. Use when you need to upload, list, describe, update, or delete machine learning models (and their versions) in the Agent Platform Model Registry. Don't use for model training, model deployment to endpoints, or managing non-Agent Platform models.

google/skills · 60 tokens

bigquery-ai-ml

Leverages BigQuery's built-in machine learning and GenAI capabilities for advanced data analytics. Use when you need to write SQL queries that perform time-series forecasting, predict values, detect outliers or anomalies, find key drivers, perform semantic search or vector search, classify text, calculate similarity…

google/skills · 104 tokens

edge-to-edge

Use this skill to migrate your Jetpack Compose app to add adaptive edge-to-edge support and troubleshoot common issues. Use this skill to fix UI components (like buttons or lists) that are obscured by or overlapping with the navigation bar or status bar, fix IME insets, and fix system bar legibility.

android/skills · 67 tokens

twitter-reader

Read Twitter/X for financial research using opencli (read-only). Use this skill whenever the user wants to read their Twitter feed, search for financial tweets, view bookmarks, look up user profiles, or gather market sentiment from Twitter/X. Triggers include: "check my feed", "search Twitter for", "show my…

himself65/finance-skills · 161 tokens

referral-program

When the user wants to design, launch, or optimize an in-app referral / invite / share-to-earn program — including reward structure, mechanics, fraud prevention, deep link setup, and viral coefficient measurement. Use when the user mentions "referral program", "invite a friend", "refer and earn", "share to earn"…

Eronred/aso-skills · 159 tokens

apple-search-ads

When the user wants to set up, optimize, or scale Apple Search Ads (ASA) campaigns — including keyword bidding, match types, campaign structure, Creative Product Sets, CPP routing, and ROAS optimization. Use when the user mentions "Apple Search Ads", "ASA", "Search Ads", "Search tab ads", "Today tab ads", "CPT"…

Eronred/aso-skills · 127 tokens