Skip to content

astro-builder: CSS generation ignores design system variables #41

Description

@pcamarajr

Problem

When the astro-builder plugin generates CSS (in component <style> blocks or other styles), it does not consistently use the CSS custom properties defined during init.

The init phase documents design tokens (colors, typography, spacing) in .astro-builder/design-system.md, but nothing ensures those variables are actually used when CSS is written later. As a result, agents and Claude interactions may produce hardcoded values instead of referencing the project's design system.

Impact

  • Visual inconsistency: generated components may not match the intended design
  • Design system tokens go unused despite being defined during project setup
  • No enforcement or signal when raw values are used instead of CSS variables

Affected plugin

astro-builder

Steps to reproduce

  1. Run /astro-builder:init and complete the design system setup
  2. Ask Claude (via agent or directly) to create a new component with styles
  3. Observe that the generated <style> block may use raw color/spacing values instead of var(--token-name)

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions