orange-clean-paper-saas

name	orange-clean-paper-saas
description	创建一套干净的纸色 SaaS 设计系统：温暖中性色、橙色强调信号、圆角高级表单，以及精致的产品插画面板。

橙色干净纸感 SaaS 技能

何时使用

• 创建一套干净的纸色 SaaS 设计系统：温暖中性色、橙色强调信号、圆角高级表单，以及精致的产品插画面板。

工作流程

适用范围

• 把它作为一个完整的设计系统方向，贯穿页面外壳、表单、产品模型图、卡片、CTA、插画区和动效。
• 当界面应像一个精致的 SaaS 引导流程或产品体验、建立在温暖纸色而非冰冷白色仪表盘之上时使用。
• 这不是通用的初创公司 UI，也不是纯技术的纸质系统。它应显得亲切、精致、由产品主导，同时保持高级。

视觉目标

• 用温暖的米白、奶油色、羊皮纸和淡石色面板构建界面，而非刺眼的纯白。
• 用橙色作为步骤、按钮、激活态、图标、聚焦输入框和小型强调细节的主信号色和行动色。
• 保持整个系统干净现代，配以充裕圆角、柔和阴影和精心分层的面板，显得有质感但不拟物。
• 把一个功能性表单或引导区与一个精致的视觉产品面板配对，如插画卡片、浮动数据或有维度感的应用物件。
• 让情绪显得沉静而高级，把橙色用作温暖有活力的强调，而非吵闹的营销爆点。

实现指引

• 优先使用一个大型圆角主容器，配以微妙的渐变边框处理和围绕主 UI 的温暖背景外壳。
• 用高质量的浅色输入框构建表单：纸色填充、细腻边框、微妙聚焦环，以及绑定橙色强调的柔和 hover 态。
• 有节制地把橙色用于步骤标记、主 CTA、高光图标、链接文字、微徽章和小型进度指示器。
• 用温暖渐变、浮动卡片、柔和玻璃质白色 UI 面板或渲染的产品物件创建一个配套的产品插画区，以在视觉上传达平台。
• 使用干净的无衬线排版、细到常规字重的正文，以及克制的层级，让体验显得优雅而平易近人。
• 动效应保持精致、产品级：遮罩式文本显现、轻柔浮动元素、平滑的输入聚焦过渡，以及插画区中沉静的环境运动。

推荐模式

• 分栏引导卡片，一侧是表单面板，另一侧是视觉产品演示面板。
• 温暖纸色面板分层置于略亮或略柔和的放射状页面背景内部。
• 圆角白色或奶油色卡片，配以浅色渐变边框和柔和的橙色调阴影。
• 浮动 UI chip、余额卡片、卡片物件或产品视觉，增添纵深而不杂乱。
• 橙色主按钮配以安静的次级动作和中性分隔线，以保持干净 SaaS 调性。

调节旋钮

• 纸感温度：根据品牌感觉在偏冷的奶油色和更浓的羊皮纸之间切换。
• 橙色活力：让强调色鲜明到有活力，又克制到界面保持沉静。
• 圆角与柔和度：用充裕的圆角和阴影抬升，但避免把系统变成气泡感的消费 UI。
• 视觉丰富度：根据页面应有多"插画密集"来增减浮动产品元素。
• 对比：在温暖背景、白色卡片、灰色文案和橙色动作之间保持清晰可读性。

避免

• 忽视温暖纸感特质的冰冷蓝灰 SaaS UI。
• 没有柔和度、产品纵深或高级面板处理的扁平白色表单。
• 用橙色浸透整个页面，而非把它当作信号色。
• 厚重的复古纸感做旧，让 SaaS 产品显得陈旧。
• 过度复杂的插画或嘈杂的 3D 物件，分散对干净引导体验的注意。