Design Baseline logo

Design Baseline

Community
Bandersnatch0x
design-baseline

Discover, validate, or draft a project-owned DESIGN.md before adding or revising UI in an existing frontend. Use during design-playbook initialization when a repository already has pages, components, themes, tokens, or styles. When new UI looks inconsistent with existing surfaces. When DESIGN.md may be missing, incomplete, conflicting, or stale. Or when the user asks to generate a design system from existing frontend source. Produces a provenance-backed draft and requires confirmation before creating or replacing the durable baseline.

Overview

PublisherBandersnatch0x
Repositorydesign-playbook
Skill namedesign-baseline
Stars
3
Forks
0
Bundled files
4
Links
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • 4 bundled files

    Scripts, templates, and references the model can read while it works. Files are read-only and never executed.

  • Open source

    Published by Bandersnatch0x on GitHub. Read the source before you install it.

Installation

Install the Design Baseline AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
    https://github.com/Bandersnatch0x/design-playbook/tree/main/packages/design-playbook/skills/design-baseline
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/Bandersnatch0x/design-playbook.git /tmp/design-playbook
mkdir -p .claude/skills
cp -r /tmp/design-playbook/packages/design-playbook/skills/design-baseline .claude/skills/design-baseline
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Design Baseline in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Design Baseline on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Design Baseline is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

design-baseline

Establish one project-owned visual authority before UI decisions or Fill. Treat existing code and rendered pages as evidence, not as permission to silently rewrite DESIGN.md.

Authority boundary

This skill ownsDoes not own
Discovering and structurally validating project DESIGN.mdFunctional success criteria (spec L1–L6)
Extracting a draft from first-party frontend sourceThird-party reference Keep, Change, and Do not copy (reference-intake)
Source hashes, observed and inferred labels, confidence, unresolved gapsComponent and template selection (ui-picker)
Confirmation before a durable baseline writePass or Fail verdict (ui-evaluator)

Canonical authority is <project-root>/DESIGN.md. Accept .stitch/DESIGN.md as a compatibility candidate only. If both exist with different content, stop for an explicit user choice. Never merge them silently.

Deep module (SSOT for deterministic work)

All path resolution, scanning, drafting, hashing, durable write, and re-verification live in one module:

scripts/design_baseline.py

Public interface:

python
prepare(project_root, run_root) -> state
confirm(project_root, run_root, decision, reason=None) -> state
verify(project_root, run_root) -> state

CLI:

text
python scripts/design_baseline.py prepare <project_root> <run_root>
python scripts/design_baseline.py confirm <project_root> <run_root> --decision accept|waive [--reason ...]
python scripts/design_baseline.py verify  <project_root> <run_root>

On Windows, non-ASCII --reason text can be mangled between shell and Python (ANSI code page, e.g. GBK on zh-CN). When argv carries undecodable bytes, confirm refuses with an error instead of persisting mojibake. Prefer the module API (confirm(project_root, run_root, decision, reason=...)) or ASCII text for CLI --reason with non-ASCII content.

State is a cache, not authority. Every public call resolves paths against the supplied project root. verify re-hashes the bound baseline and its first-party sources before returning a downstream binding. Fill and other consumers may only use a binding that just passed verify.

statusMeaning
readyBound baseline (decision.kind = existing or accepted)
needs_confirmationProvenance-backed draft awaits accept or waive; baseline_rejection records why an existing candidate was not bound (null when none existed)
waivedExplicit waiver confirmed by this run's user, carrying that user's non-empty reason
ambiguousConflicting candidates. Human choice required

Workflow

1. Classify the project

Apply the existing-product gate when the orchestrator returned requires_baseline, including durable review, diagnosis, or plan work on an existing product. Skip when entry routing returned no-run or did not set requires_baseline. Do not independently reclassify the repository as greenfield to skip after routing. Narrate the skip in one line.

Done when: the run records existing-product or greenfield, with the file signals used for that classification.

2. Prepare (prepare)

Run prepare(project_root, run_root). Deterministic code:

  • discovers DESIGN.md / .stitch/DESIGN.md (rejects escaping symlinks);
  • validates a complete existing baseline in place;
  • or scans first-party theme, token, style, component, and page sources, writes evidence.json + DESIGN.draft.md, and returns needs_confirmation;
  • writes .scratch/<run>/design-baseline/state.json (schema: design-baseline/v1).

Agent work after prepare:

  • if status is ready then cite path + sha256 and continue;
  • if ambiguous then stop for the smallest user decision. Never invent a third authority;
  • if needs_confirmation then review the draft. Optionally enrich only material claims with [inferred confidence=…] in the draft file, then re-run prepare if structure and sources changed (do not hand-edit hashes). When baseline_rejection is set, an existing DESIGN.md was rejected for the stated reason, accepting the draft replaces it (a backup is kept; see Confirm).

Never write or overwrite project DESIGN.md in this step.

Done when: state.json exists with one of the four statuses above. Drafts carry source paths + SHA-256 and observed and inferred labels.

3. Confirm or waive (confirm)

Show a compact summary: atmosphere, core tokens, typography, layout, shared components, conflicting evidence, inferred claims. Ask before the durable write.

  • Accept. confirm(..., decision="accept") atomically writes canonical <project-root>/DESIGN.md from the bound draft and returns a ready state. If a differing DESIGN.md already exists, the previous content is backed up byte-exact first and the state records it as replaced_baseline (path, sha256, backup). The CLI prints an overwrite warning with the backup path.
  • Waive. confirm(..., decision="waive", reason=<user reason>) does not write DESIGN.md. Existing-product Fill may continue only after this explicit waiver. A waiver belongs to the user, not the agent. Recommending it is allowed, but the first waiver of a run must be put to this run's user and answered there. The reason carries what that user actually said. A waiver or ruling from an earlier run, another agent, or a surviving state.json is provenance, not this user's consent. ADR-0033 draws the same boundary for repository-stored preferences. Never call confirm(..., "waive") before this run's user has answered.
  • Revise. edit only the draft (or fix sources), then prepare again.

Never infer acceptance from silence. Never replace a valid baseline merely because extraction found different implementation details. Report the drift for a decision.

Done when: state.json is ready (existing or accepted) or waived with a non-empty reason given by this run's user.

3a. Promote an adjudicated component (promote)

A component promotion requires a user promotion_decided/promote governance event and a fresh execution-time check. The source must be a real project-relative file. The current .scratch/<run>/decision-report.md history must still meet the component threshold. The governance event alone is not a durable bypass for stale or fabricated candidates. Token promotion remains governed separately because token candidate extraction is a different input seam.

4. Verify before Fill (verify)

Immediately before Fill (and any time a consumer needs a binding), call verify(project_root, run_root).

  • Re-checks path containment, baseline hash, source freshness, and provenance alignment. Promoted component sources are bound by source_sha256. Source drift fails closed and requires a fresh adjudication and promotion rather than silently updating the binding.
  • Rejects forged state.json, stale sources, candidate conflicts, and symlink escape.
  • On success, returns the binding: baseline path + sha256 (or an explicit waiver).

Downstream may only consume this verified result, not a hand-edited confirm file and not a draft.

Done when: verify returns without error. The decision report can cite design-baseline: <path> sha256:<digest> or waived:<reason>.

5. Bind downstream consumers

ConsumerRequired behavior
ui-pickerCite the verified baseline in the decision report. Preserve visual roles, density, layout, and component conventions unless a declared change is approved
FillUse project tokens and shared components. Log missing roles instead of inventing raw values. Gate on successful verify
craft-guardTreat obvious baseline drift as a craft failure, not merely personal taste
ui-evaluatorPoint observable drift back to DESIGN.md. The baseline is supporting declaration evidence, never L6 runtime proof by itself

Third-party or sample DESIGN.md files remain reference-intake inputs. They never become project authority automatically.

Artifacts

text
<project-root>/DESIGN.md                            # durable authority after accept
.scratch/<run>/design-baseline/state.json           # gate cache (schema design-baseline/v1)
.scratch/<run>/design-baseline/evidence.json        # extraction evidence (when drafted)
.scratch/<run>/design-baseline/DESIGN.draft.md      # proposal; never authority by itself
.scratch/<run>/design-baseline/previous-DESIGN.md   # backup of a replaced DESIGN.md (when overwritten)

The deep module prepare/confirm/verify is the sole gate surface. An adopted existing DESIGN.md only needs to carry verifiable source provenance (path + SHA-256 under ## Source Evidence & Confidence) to be bound. The other section names in references/design-template.md are draft guidance, not a structural contract imposed on hand-written baselines.

Scope fence

InOut of scope
First-party visual baseline and provenanceFunctional behavior belongs to ux-spec
Existing-source extractionExternal inspiration belongs to reference-intake
Confirmation before durable writeScene, template, and component decision belongs to ui-picker
Baseline drift source for point-backRuntime evidence judgment belongs to ui-evaluator

Bundled files

The model reads these on demand while the skill is loaded. They are exposed as readable files and are never executed.

Frequently asked questions

What does the Design Baseline AI skill do?

Discover, validate, or draft a project-owned DESIGN.md before adding or revising UI in an existing frontend. Use during design-playbook initialization when a repository already has pages, components, themes, tokens, or styles. When new UI looks inconsistent with existing surfaces. When DESIGN.md may be missing, incomplete, conflicting, or stale. Or when the user asks to generate a design system from existing frontend source. Produces a provenance-backed draft and requires confirmation before creating or replacing the durable baseline.

Why use Design Baseline on TypingMind?

Because you install it once and use it with any model. Design Baseline is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Design Baseline in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/Bandersnatch0x/design-playbook/tree/main/packages/design-playbook/skills/design-baseline. TypingMind reads its SKILL.md and bundles its files and installs it as a skill you can enable per chat.

Which AI models can use Design Baseline?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Design Baseline?

As many as you like. As long as a model supports skills, you can use Design Baseline with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Design Baseline AI skill free?

It is published on GitHub by Bandersnatch0x. Check the repository for licensing terms. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

View all

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇