What Is a Fidelity Receipt in Diagram Design's Onboarding Process?

A fidelity receipt is an audit trail that records exactly what branding data—colors, fonts, and URLs—was extracted from a source website during onboarding and saved to references/style-guide.md.

In the cathrynlavery/diagram-design repository, onboarding transforms a website's visual identity into structured design tokens. The fidelity receipt ensures this extraction is transparent, verifiable, and reproducible. According to the source code at [README.md lines 163 and 444](https://github.com/cathrynlavery/diagram-design/blob/main/README.md#L163), this receipt documents every decision made during the automated brand analysis.

How the Fidelity Receipt Fits Into Onboarding

The onboarding flow is defined in skills/diagram-design/references/onboarding.md. When you trigger onboarding with a URL, the skill executes this sequence:

  1. Fetch the target homepage
  2. Extract palette and font stack from CSS and rendered output
  3. Map raw values to semantic roles: paper, ink, accent, muted
  4. Preview a diff of proposed changes
  5. Write confirmed tokens to references/style-guide.md
  6. Emit the fidelity receipt for your records

The receipt serves as a contract between the source website and your diagram system. If a diagram's colors drift from expectations, you can consult the receipt to verify what was originally captured.

What a Fidelity Receipt Contains

Based on the implementation in [skills/diagram-design/references/onboarding.md](https://github.com/cathrynlavery/diagram-design/blob/main/skills/diagram-design/references/onboarding.md), the receipt includes:

  • Sampled URL — the exact page analyzed
  • Color roles — mapped to semantic purposes (paper, ink, accent, muted)
  • Font families and weights — per usage context (titles, node names, sublabels)
  • Font source URLs — including CDN links or local fallbacks
  • Fallback declarations — backup fonts when primary sources fail

Example Fidelity Receipt Output

After confirming an onboarding session, the skill prints a receipt similar to this:

Brand Fidelity Receipt
----------------------
Sampled URL: https://mycompany.com
Paper (background): #fafafa
Ink (primary text): #222222
Accent (CTA): #eb6c36
Muted (secondary text): #666666
Title font: "Inter", weight 600, source https://fonts.googleapis.com/css?family=Inter
Node-name font: "Inter", weight 400, source https://fonts.googleapis.com/css?family=Inter
Sublabel font: "Source Code Pro", weight 400, source https://fonts.googleapis.com/css?family=Source+Code+Pro

This format is generated by the skill itself; the exact field order and labeling match the internal template in the onboarding reference file.

Running Onboarding and Capturing the Receipt

Trigger onboarding through your agent interface:

You: "onboard diagram-design to https://mycompany.com"

The agent responds with an extraction summary. After you confirm with "yes, apply it", the fidelity receipt appears in the output stream. Save this receipt alongside your project documentation for future audits.

Why Fidelity Receipts Matter for Brand Governance

Reproducibility — Without the receipt, you cannot reconstruct how paper: #fafafa was chosen over #f5f5f5. The receipt locks the source of truth.

Verification — Compare subsequent diagram renders against the receipt's hex values and font URLs to detect drift.

Profile Persistence — As documented in [commands/profile.md](https://github.com/cathrynlavery/diagram-design/blob/main/commands/profile.md), saved onboarding profiles reference the same tokens captured in the original receipt. When you apply a profile later, you are implicitly accepting the fidelity receipt's data.

Summary

  • A fidelity receipt documents the exact branding data extracted during diagram-design onboarding
  • It records URLs, color roles, fonts, weights, sources, and fallbacks from the target website
  • The receipt is generated in skills/diagram-design/references/onboarding.md and tokens are persisted to references/style-guide.md
  • It enables auditability, reproducibility, and brand consistency across diagram generations

Frequently Asked Questions

How do I trigger onboarding in Diagram Design?

Invoke your agent with the command: "onboard diagram-design to [URL]". The skill will fetch the site, extract tokens, show a preview diff, and await your confirmation before writing to references/style-guide.md and emitting the fidelity receipt.

Where is the fidelity receipt stored?

The receipt is printed to the agent output stream upon successful onboarding. It is not automatically written to disk—you must capture it manually. The underlying tokens it documents are persisted in references/style-guide.md.

Can I regenerate a fidelity receipt for an existing profile?

No. The receipt is generated only during the live onboarding extraction. However, you can re-run onboarding against the same URL to produce a fresh receipt, or manually document the values currently in references/style-guide.md for your records.

What happens if font sources in the receipt become unavailable?

The receipt logs both primary sources and any fallbacks declared during extraction. If a CDN link fails, the diagram system falls back to the documented alternative. For critical projects, verify source URLs in the receipt before production use.

Have a question about this repo?

These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:

Share the following with your agent to get started:
curl -s "https://instagit.com/install.md"

Works with
Claude Codex Cursor VS Code OpenClaw Any MCP Client

Maintain an open-source project? Get it listed too →