跳到主要内容
← 博客

把一套设计系统 fork 成另一个站

Astro设计系统

做这个个人站时,我没有从空白页开始。我把之前一个企业官网的设计内核整个搬了过来, 只换了品牌色内容

为什么能这么干

那套内核从一开始就按「单一数据源」设计:

  • 颜色全在 CSS token 里,深浅主题只是一次 token 翻转
  • 文案全在 i18n 表里,组件不写死任何字符串
  • 每个部件集中定义、统一引入,没有散落的硬编码

所以「换品牌」这件事,80% 落在三个文件上:token、i18n、site 配置。 组件几乎原样复用。

换色

原站是橙色的「热」信号系统,这里换成霓虹紫 #A855F7。因为信号色是一个 token, 全站的链接、激活态、CTA、Hero 粒子流,一改全改。

--color-signal: #a855f7; /* 一处定义 */

收获

最大的体会:纪律不是负担,是杠杆。前期把单一数据源、视觉自检做扎实, 后期复用的时候,一个完整的站几小时就能立起来。