design-tree

design-tree is a skill for Claude Code from PrabhdeepSingh/claude-plugins. It costs 62 tokens per session (5,716 once invoked), scanned A, original, MIT.

A decision-making method that lays out real alternatives as branches, records why one was chosen, and keeps the rejected options visible.

In plain words
What is it for?
Use it when planning implementations or choosing between architectures, libraries, or data models, especially when several options are viable.
Why use it?
It prevents important design choices from becoming unexplained assumptions or being repeatedly reopened. It also makes it easier to return to an earlier choice when later work exposes a problem.

Skill for Claude Code

Written for Claude Code: allowed-tools in frontmatter. Also seen: mentions subagents.

Part of the sonu plugin — 26 skills, 3 commands shipped together

Good fit Use it when planning implementations or choosing between architectures, libraries, or data models, especially when several options are viable.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/prabhdeepsingh/claude-plugins/design-tree
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.

Any agent
npx skills add PrabhdeepSingh/claude-plugins --skill design-tree
Clone the repo
git clone --depth 1 https://github.com/PrabhdeepSingh/claude-plugins

Made for: Claude Code.

Or install sonu, the plugin that ships this one along with the rest of its 26 skills, 3 commands.

Wrote 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.

agentmods badge for design-tree

README.md
[![agentmods](https://agentmods.dev/badge/skills/prabhdeepsingh/claude-plugins/design-tree/github.svg)](https://agentmods.dev/skills/prabhdeepsingh/claude-plugins/design-tree)
Your own site
<a href="https://agentmods.dev/skills/prabhdeepsingh/claude-plugins/design-tree"><img src="https://agentmods.dev/badge/skills/prabhdeepsingh/claude-plugins/design-tree/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.

agentmods 80×15 button for design-tree

Your own site · 80×15
<a href="https://agentmods.dev/skills/prabhdeepsingh/claude-plugins/design-tree"><img src="https://agentmods.dev/badge/skills/prabhdeepsingh/claude-plugins/design-tree.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 62 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 5,716 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
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.1 $0.00062 $0.05716
Opus 5.5 $0.00025 $0.02286
Sonnet 5.5 $0.00012 $0.01143
Haiku 4.5 $0.00006 $0.00572

Measured 1mo ago against content hash 14e4b3d91dbd, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

design-tree 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 1mo 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.

sonu/skills/design-tree/SKILL.md · 181 lines

How it starts

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

Design Tree — decide by branching, not by marching

Design isn't a straight line from question to answer. It's a tree: each decision point is a node with multiple branches; you pick one, sometimes backtrack, and move forward. The genealogy of what you chose and what you didn't is the record that keeps decisions from getting silently relitigated later, and that lets you backtrack to a real fork when a downstream choice invalidates an earlier one.

This skill makes you design that way: interview first to confirm you're solving the right problem, then expose the real decision points, enumerate genuine alternatives, record the chosen branch with its rationale, and preserve the rejected branches with the reasons they lost.

How to apply this

Before mapping any decision, interview the user. Before branching, before enumerating anything — ask. A few sharp, targeted questions about intent, constraints, success criteria, and non-goals are the highest-leverage work in any design task. Designing the right problem is worth more than any number of well-reasoned branches on the wrong one.

When planning or designing an approach, run through this in sequence: interview → load applicable standards → find decision points → enumerate alternatives → record choices and rationale → emit the tree. When invoked directly as /sonu:design-tree, apply it to $ARGUMENTS — the text typed after the invocation; if that token appears literally or is empty, apply it to the current design, plan, or discussion in context; and if the intent is to design AND implement end-to-end, run /sonu:build instead — it runs this methodology as its design gate, then builds test-first and self-reviews. When in plan mode, write the tree into the plan file's ## Design Tree section; otherwise print it in-chat.


1. Interview first — confirm the problem before solving it

This is the highest-leverage step. Ask before you branch. The goal is a shared understanding of what you're designing: intent, constraints, success criteria, and non-goals. A few sharp questions up front save context, tokens, and the headache of treeing the wrong thing.

Read the full file on GitHub · 181 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. 1mo ago Changed · +7 lines 14e4b3d91dbd
  2. 1mo ago Changed · +2 lines 3e78bf119188
  3. 1mo ago First seen · 172 lines · 62 tokens per session scan A ad74f9d5a8fb

Subscribe to this mod's changes

design-tree is a skill published in the GitHub repository PrabhdeepSingh/claude-plugins (4 stars, last pushed today), licensed MIT. It adds 62 tokens to every session and 5,716 once invoked, about $0.0002 per session on Opus 5.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

svg-mastery

Expert knowledge for working with SVG (Scalable Vector Graphics) — optimization, embedding, animation, accessibility, responsive scaling, React integration, filters, and programmatic creation. Use when the user asks to "optimize SVG", "clean up SVG", "reduce SVG file size", "embed SVG in HTML", "inline SVG vs img…

lukaskellerstein/claude-my-marketplace · 276 tokens

icon-library

Fetch pre-made SVG icons from open-source icon libraries (Lucide, Heroicons, Tabler Icons) for use in websites, presentations, Figma designs, or any project. Use when the user asks to "add an icon", "use a search icon", "find an icon for settings", "get SVG icons", or needs clean SVG icons. NEVER draw icons manually …

lukaskellerstein/claude-my-marketplace · 104 tokens

animation-system

CSS and GSAP animation patterns for websites — ScrollTrigger, timelines, stagger effects, page transitions, micro-interactions, and performance optimization. Use when implementing animations for web design projects, when the user wants scroll-triggered animations, page load reveals, GSAP integration with React/Vite…

lukaskellerstein/claude-my-marketplace · 78 tokens

design-review

Review and critique existing designs, websites, or frontend code against design principles. Checks for common anti-patterns like generic fonts, poor contrast, inconsistent spacing, and lack of visual hierarchy. Use when the user asks to "review my design", "what's wrong with this layout", "critique my website", "how…

lukaskellerstein/claude-my-marketplace · 110 tokens

frontend-aesthetics

Design guidance and aesthetic patterns for building beautiful, distinctive frontends — websites, web apps, landing pages. Provides typography strategies, color application, motion choreography, layout composition, and component design recipes. Use when the user asks to "make this look better", "improve the design"…

lukaskellerstein/claude-my-marketplace · 122 tokens

styleguide

Create a comprehensive design language and styleguide for any project — websites, apps, blogs, presentations, marketing pages. Given a project type, brand, and audience, produces aesthetic direction, font selections with pairings, color strategy, spacing philosophy, imagery style, and tone. Use when the user asks to…

lukaskellerstein/claude-my-marketplace · 128 tokens