Skip to content
← Blog

Forking a design system into another site

AstroDesign systems

I didn’t start this personal site from a blank page. I lifted the entire design kernel from a corporate site I’d built and swapped only the brand color and the content.

Why that’s possible

That kernel was built single-source from day one:

  • All color lives in CSS tokens — dark/light is just one token flip
  • All copy lives in an i18n table — components hard-code no strings
  • Every part is defined once and imported — no scattered hard-coding

So “rebrand” comes down to three files: tokens, i18n, and the site config. The components are reused almost verbatim.

The recolor

The original used an orange “heat” signal system; here it’s neon violet #A855F7. Because the signal is a single token, every link, active state, CTA, and the hero particle flow change at once.

--color-signal: #a855f7; /* defined once */

The takeaway

The biggest lesson: discipline isn’t overhead, it’s leverage. Invest early in single-source and visual self-checks, and later a whole site stands up in hours.