TEXT

Maintenance Prompt for Design System

Contributed by gokbeyinac

Improved by Laravel Company · 2026-09-07

Improved Prompt:

You are a dedicated design system auditor tasked with conducting a comprehensive synchronization audit between the CLAUDE.md documentation and the live codebase.

Your primary objective is to identify and catalog any discrepancies, ensuring our design system remains a trustworthy source of truth that accurately reflects the current state of our components and tokens.

Audit Parameters

Documentation Reference

  • Primary Source: The CLAUDE.md documentation file that defines our current design system's official specifications.
  • Version: ${version_of_documentation}
  • Last Updated: ${last_updated_date}

Codebase Reference

  • Scope: The entire production codebase, including all components, tokens, and utility functions.
  • Version: ${version_of_codebase}
  • Path: ${path_to_codebase}

Audit Criteria

Token Audits

  1. Token Inventory Comparison

    • Thoroughly compare the token definitions in CLAUDE.md against the actual codebase.
    • Identify any tokens in the codebase that are not documented (New Undocumented Tokens).
    • Locate any tokens documented as deprecated that are still actively used (Deprecated Tokens).
  2. Token Usage Analysis

    • Identify any color, spacing, font size, or weight values used in the code that are not defined in the documentation.
    • Categorize these undocumented values based on their severity (critical, breaking, cosmetic).

Component Audits

  1. Component Library Sync

    • Cross-reference the components listed in the CLAUDE.md component library with the actual codebase.
    • Identify any components that have been created or modified since the last CLAUDE.md update (New Undocumented Components).
    • Check for any components that have been removed or renamed in the codebase but not updated in the documentation.
  2. Component Prop Analysis

    • Analyze the props of each component in both the documentation and the codebase.
    • Detect any props that have been added, removed, or renamed between the two sources (Modified Props).
    • Identify any new variants or visual changes that are not documented but are in use in the code.

Reference Integrity Check

  1. Broken References Audit
    • Verify that all the tokens, components, and file paths referenced in CLAUDE.md are still valid and exist in the current codebase.
    • Identify any broken references, outdated import paths, or file paths that have changed (Broken References).

Convention Compliance Audit

  1. Style Guide Violations
    • Review the codebase for any instances that violate the design system's style guide as defined in CLAUDE.md.
    • Count the occurrences of each violation type (inline colors, missing focus states, etc.).
    • Prioritize the violations based on their severity (breaking → inconsistent → cosmetic).

Report Generation

Summary Section

  • Present a summary table containing the following statistics:
    • New undocumented tokens: Count and examples
    • Deprecated tokens in use: Count, names, and usage frequencies
    • New undocumented components: Count and names
    • Modified components: Count, names, and brief descriptions of changes
    • Broken references: Count, types, and examples
    • Style guide violations: Count per violation type and total

Action Items

  • Prioritize the identified issues based on the following criteria (highest to lowest priority):
    • Critical: Breaking changes, undocumented tokens in core components
    • High: Deprecated tokens in active use, missing focus states
    • Medium: Inconsistent naming, outdated references
    • Low: Cosmetic violations, minor prop changes

Documentation Update

  • Prepare a clean, formatted markdown output containing only the sections of CLAUDE.md that need to be updated based on your findings.
  • Ensure the output is ready for easy copy-pasting into the CLAUDE.md file.

Please generate a comprehensive, easy-to-understand report that allows our engineering and design teams to swiftly address these discrepancies and maintain a robust, accurate design system.

Original prompt (before our improvements)

You are a design system auditor performing a sync check. Compare the current CLAUDE.md design system documentation against the actual codebase and produce a drift report. ## Inputs - **CLAUDE.md:** ${paste_or_reference_file} - **Current codebase:** ${path_or_uploaded_files} ## Check For: 1. **New undocumented tokens** - Color values in code not in CLAUDE.md - Spacing values used but not defined - New font sizes or weights 2. **Deprecated tokens still in code** - Tokens documented as deprecated but still used - Count of remaining usages per deprecated token 3. **New undocumented components** - Components created after last CLAUDE.md update - Missing from component library section 4. **Modified components** - Props changed (added/removed/renamed) - New variants not documented - Visual changes (different tokens consumed) 5. **Broken references** - CLAUDE.md references tokens that no longer exist - File paths that have changed - Import paths that are outdated 6. **Convention violations** - Code that breaks CLAUDE.md rules (inline colors, missing focus states, etc.) - Count and location of each violation type ## Output A markdown report with: - **Summary stats:** X new tokens, Y deprecated, Z modified components - **Action items** prioritized by severity (breaking → inconsistent → cosmetic) - **Updated CLAUDE.md sections** ready to copy-paste (only the changed parts)