GoodVibe
登录
返回工具 · 工具

tweakcn：shadcn 主题可视化调参

拖滑块调出 shadcn/Tailwind 主题，导出 CSS 变量直接用

Details
v1.02026-06-24

Overview

一个可视化的 shadcn/ui 主题编辑器：在界面上调色板、圆角、字体、阴影，实时预览整套组件，导出 CSS 变量直接粘进项目。免去手写一堆 token 的过程，适合给 vibe coding 出来的界面快速换肤。

How to Use

  1. 1点右侧「下载」（需登录会员）拿到文件，解压备用。
  2. 2打开你的 AI 编程工具（Cursor / Claude Code / Codex），把它发给 AI。
  3. 3让 AI「按我项目的设计系统接入」：对齐配色、圆角、间距与深色模式，用现成组件而非临时硬编样式。
  4. 4在浏览器里核对间距与移动端响应式，让 AI 按需微调，直到拿得出手。

适用场景：给 shadcn 项目换肤、统一设计 token、快速试配色

适配工具Codex CodexClaude ClaudeCursor Cursor