Suno

一个通过神奇、沉浸式界面将文本转化为音乐的数字工作室。

电影感深色模式，搭配高对比度的暖白色和充满活力的渐变强调色。

geometric-sans

• display64px · 500

4px 基准单位

1px solid rgba(247, 244, 239, 0.1)

0 25px 50px -12px rgba(0,0,0,0.25) · 0 10px 15px -3px rgba(0,0,0,0.1) · -5.37px 0px 40px 0px rgba(255,176,3,0.07) · 5.37px 0px 40px 0px rgba(254,60,125,0.07)

以英雄区为核心，配备浮动卡片和中央提示输入框。

平滑的颜色过渡 · 悬停时细微的变换缩放 · 英雄文本的打字机效果

按钮和卡片在悬停时有细微的缩放和颜色过渡。 · 立即提供视觉反馈，变换重置。

• button 药丸形状，带有渐变背景或细微边框。
• card 圆角，带有细微的玻璃拟态或投影效果。
• chip 小型圆角药丸，样式简约。
• input 大号圆角输入框，集成操作按钮。
• hero 居中文本，叠加在电影感、模糊的渐变背景上，配有浮动媒体卡片。

• 语气 富有邀请性和创造性，如同个人音乐制作人。
• 标题风格 大号、对话式、描述性的提示。
• 按钮文案 直接且面向行动（例如，“创作”、“免费加入Suno”）。

• 不要使用浅色背景——截图显示为深色（#101012）基底。
• 不要使用尖锐的圆角——截图显示大多数元素采用圆角（最大999px）。
• 不要为英雄区使用复杂的网格——截图显示为居中的单列布局。
• 不要使用多种鲜艳的强调色——截图显示“创建”按钮使用单一的主渐变（橙色/粉色）。
• 不要使用小而拥挤的排版——截图显示为大号、粗体的显示文字，字间距紧凑。
• 不要到处使用厚重的投影——截图显示投影仅用于卡片和特定的交互元素。
• 避免: 技术术语
• 避免: 激进的营销语言
• 避免: 过于正式的语气

历史提取与模型分析 · 尚未逐项校验