Playground

手绘小琴房：钢琴、吉他、架子鼓、贝斯与马林巴，支持 MIDI 外设、跟弹与灵感录制

直接预览生产邮件模板，可切换成功/失败状态、语言、标题与桌面/手机宽度

Notification Bell、Delete Button、Animated Counter，以及从 Task List 提取的圆圈勾选完成动画

原创音乐色谱 + 5 种渐变形式（linear / mesh / radial / conic / stacked）— Spectrum / Aurora / Sunset / Foil / Nebula / Cosmos，含 Hero Block + 亮暗 Showcase + Live grain tweaker

统一的 prompt 输入组件预览：basic / hero / 文件上传 / 录音 / 参数 + 扣费 pill / streaming / disabled

直接渲染 MusicDna 组件，用于审查和统一实际样式

音乐 DNA 表单中使用的所有组件分项预览，包含核心参数和动态扩展类型

项目中所有 Shadcn UI 组件的交互式预览与演示

ShareTrackDialog 波形图与 start-time 选择器的形态调试

3×3 装饰动画组件，24 种预设（16 单色 / 8 多色）+ Bloom 发光

调用 services/python 的 essentia 服务，体验完整特征提取（key/chord/rhythm/loudness/timbre/HPCP/tuning）

调用 services/python 的 basic-pitch 服务，把音频转换成 MIDI 音符 + 钢琴卷帘可视化

拟真黑胶唱片组件，支持图片或文字 JSON 切换中心标签，带受控播放与尺寸调节

重要提交动作统一用的品牌红发光胶囊：idle 余烬呼吸、hover 流光与波形、loading / disabled，含 DNA 浮层与 dock 两种容器、亮 / 暗表面对照

多色径向渐变 + 多层 inset shadow 模拟玻璃质感与立体光照的容器，支持 8 种 tone 预设 / top·bottom origin / 颜色覆盖

四方连续音乐纹理（webp / 透明背景）+ 原生 animate-pulse 的加载占位容器，可调 tileSize

/hum-to-song 的录音 / 上传区：两个等大入口、等麦克风授权、录音中（可用模拟麦克风看实时波形）、已有旋律的试听与重录

/stem-splitter 页 3 个 Mode 的 7 个音轨图标 — vocals / instrumental / drums / bass / guitar / piano / other，含 chip + result row 实际形态预览

Track Node 中使用的 4 种音频编辑操作图标 — Remix (改编) / Extend (续写) / Region Edit (局部改写) / Stem Separation (音轨分离)

深色发光卡片容器（复刻 Figma inner-shadow 配方）：近黑渐变填充 + 4 层 inner shadow 在底部内缘叠出蓝色辉光 + 可选底部外发光，shadow 按 size 等比缩放

订阅档位徽章 — compact chip 与 plan pill 两种形态，配色取自各档位封面（FREE/BASIC 中性灰，PRO 粉红日出渐变，ULTRA 深紫星云渐变），含封面对照与亮/暗表面切换

品牌标志的状态预览：出场 / 播放中 / 加载中 / 思考中 / 成功 / 失败的 SVG + CSS 动画，含可放慢的状态舞台、尺寸表、导航栏与播放器联动、favicon 底板、通知；附换标之前的旧标志作对照

左侧边栏的自绘图标：线框 / 实心两态与部件动画。含真实行样式的亮暗对照、全套总览、可放慢 5 倍的逐个放大和各尺寸表