ds-brand

A multi-page check for keeping a product's visual style consistent. It compares pages with a Design Bible, the project's rules for colours, fonts, spacing, and component styles.

In plain words
What is it for?
Use it for a sitewide consistency review when you suspect pages no longer look like part of the same product.
Why use it?
Small differences can build up as a site changes, such as buttons using different colours or pages using inconsistent padding. This scan points out that drift across pages.

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/harshii0509/designstack/brand
Any agent
npx skills add harshii0509/designStack --skill brand
Clone the repo
git clone --depth 1 https://github.com/harshii0509/designStack

Made for: Claude Code, Codex.

Per session 49 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 1,945 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.00049 $0.01945
Opus 5 $0.00024 $0.00972
Sonnet 5 $0.00010 $0.00389
Haiku 4.5 $0.00005 $0.00194

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

Security

Grade A, and why

ds-brand 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 3d 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.

brand/SKILL.md · 208 lines

How it starts

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

Preamble

"../lib/env.sh" "brand"

What this skill does

Check if everything still looks like it belongs to the same product. As you build over time, small things drift — a button becomes the wrong shade, a font switches, padding gets inconsistent. This scan catches all of that and shows you exactly where, so you can decide what to fix.

This is the multi-page consistency scan. If the user only cares about one screen after a recent UI change, route them to /ds-look. If they want a final launch gate, route them to /ds-polish.

Requires a Design Bible. If none exists, run /ds-context first.

Step 1 — Check for Design Bible

If DESIGN_BIBLE is yes, follow the standard extraction protocol in lib/bible-reader.md when reading the Bible.

If DESIGN_BIBLE is no:

"I need your Design Bible to run a brand check — it's the set of rules I compare everything against. You haven't set one up for this project yet.

Run /ds-context first — it takes about 5 minutes to set up. After that, /ds-brand will know exactly what to look for."

Stop here if no Bible.

If DESIGN_BIBLE is yes, read the full Bible. Extract every rule:

  • L1: exact hex values for all colors, exact font families, spacing scale, radius values
  • L4: component-level rules (button colors, card styles, nav style)
  • Memory Log: note any recent intentional changes so you don't flag them as drift

Step 2 — Get the pages to check

Ask the user:

"Which pages should I check? I can: A) Check 3–5 pages you tell me (recommended) B) Check everything I can find (most thorough — might take a while)

What's your URL? (e.g. http://localhost:3000)"

If they say B, discover pages by:

$B goto <base URL>
$B links

Collect up to 8 unique internal URLs to check.

If they only want one page, tell them:

"For a single page after a recent UI change, /ds-look is the better fit. /ds-brand is for a multi-page consistency scan." Then ask them for at least 3 pages or suggest switching to /ds-look.

Read the full file on GitHub · 208 lines

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. 3d ago First seen · 208 lines · 49 tokens per session scan A 1a61ac7f9eed

Subscribe to this mod's changes

ds-brand is a skill published in the GitHub repository harshii0509/designStack (13 stars, last pushed 3mo ago), licensed MIT. It adds 49 tokens to every session and 1,945 once invoked, about $0.0002 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-30.

Related

Other skills, from other repositories

systematic-debugging

Use when encountering any bug, test failure, or unexpected behavior, before proposing fixes.

obra/superpowers · 21 tokens

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.

obra/superpowers · 37 tokens

auto-perf-optimize

Run agent-driven VS Code performance or memory investigations. Use when asked to launch Code OSS, automate a VS Code scenario, run the Chat memory smoke runner, capture renderer heap snapshots, take workflow screenshots, compare run summaries, or drive a repeatable scenario before heap-snapshot analysis.

microsoft/vscode · 62 tokens

chat-perf

Run chat perf benchmarks and memory leak checks against the local dev build or any published VS Code version. Use when investigating chat rendering regressions, validating perf-sensitive changes to chat UI, or checking for memory leaks in the chat response pipeline.

microsoft/vscode · 51 tokens

chat-pet-sprite-creation

Use when creating or changing VS Code chat pet sprite art, sprite sheets, state animations, eye treatments, Stable/Insiders variants, or pet transitions under src/vs/workbench/contrib/chat/browser/widget/media/chatPet.

microsoft/vscode · 53 tokens

cpu-profile-analysis

Analyze V8/Chrome CPU profiles (.cpuprofile) and DevTools trace files (Trace-.json). Use when: profiling performance, investigating slow functions, comparing code paths, finding bottlenecks, analyzing timeToRequest, understanding call trees from sampling profiler data, analyzing layout/paint/rendering, investigating…

microsoft/vscode · 71 tokens