# What Is a Fidelity Receipt in Diagram Design's Onboarding Process? > Understand fidelity receipts in Diagram Design's onboarding. Learn how this audit trail tracks branding data like colors, fonts, and URLs extracted from source websites. Essential for project consistency. - Repository: [Cathryn Lavery/diagram-design](https://github.com/cathrynlavery/diagram-design) - Tags: getting-started - Published: 2026-08-16 --- **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`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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)](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: ```text 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: ```text 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)](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`](https://github.com/cathrynlavery/diagram-design/blob/main/skills/diagram-design/references/onboarding.md) and tokens are persisted to [`references/style-guide.md`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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`](https://github.com/cathrynlavery/diagram-design/blob/main/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.