Skip to main content
主题是屏幕的共享颜色调色板和圆角设置。每个文件都有一个主题和外观（浅色或深色），屏幕会使用主题的令牌进行样式设置。编辑主题后，所有使用该主题的屏幕都会随之更新，因此您的团队可以基于同一套设计决策工作，而不必在每条提示词中重复描述颜色。 您创建或生成的主题会保存到您的组织中，并列在 Home 页面的 Themes 下，因此组织中的任何文件都可以使用这些主题。

​
为文件选择主题

在文件内的提示词编辑器中，为新屏幕选择主题和外观。Home 页面的提示框中没有主题按钮。
1

打开主题菜单

在提示词编辑器中，点击主题按钮。它会显示当前主题的色块；当主题为 Automatic 时，则显示色轮。菜单标题为 Theme for new screens。
2

选择主题

选择 Automatic、您组织中的某个主题（列在最前），或内置主题：Default、Blue、Grayscale、Green、Ice、Orange、Red、Rose、Violet 或 Yellow。
3

选择外观

在 Appearance 下，选择 Light 或 Dark，或选择 Automatic，让 Flowstep 根据您的提示词为每个屏幕自行决定。例如，提示词中写的是”深色仪表板”，生成的结果就是深色的。
您的选择将应用于接下来生成的屏幕。画布上已有的屏幕保持原有外观。

​
让 Flowstep 设计主题

当文件还没有主题时（例如新文件的主题保持为 Automatic），Flowstep 会在生成的首批屏幕中同时设计一个自定义主题。您会在聊天中看到 Designing theme 步骤，表示它正在工作。 Flowstep 会基于以下内容构建主题：
  • 您在提示词中提到的颜色
  • 设计准则中的颜色
  • 附件中的品牌颜色，以及您粘贴的链接中的品牌颜色
  • 当没有更具体的信息时，提示词中描述的产品和氛围
该主题会获得一个简短的名称、适用于浅色和深色的完整调色板，以及一个圆角设置。它会保存到您组织的 Home 页面 Themes 下，此后该文件生成的所有屏幕都会使用它。 文件有了主题后，Flowstep 不会自行再设计另一个。如需全新主题，请在主题菜单中重新选择 Automatic。下一次生成会设计新主题，文件随之采用新主题。如果 Flowstep 无法设计主题，文件会回退到内置主题。
在第一条提示词中提及您的品牌颜色，或在生成前在设计准则中进行设置，生成的主题就会以此为起点。

​
更改单个屏幕的主题

如需单独重新设计某个屏幕，而不影响文件中的其他部分：
  1. 在画布上选中该屏幕。
  2. 在屏幕上方的菜单中，点击 Theme 按钮。
  3. 选择您组织的某个主题或内置主题，或在 Light 和 Dark 之间切换。
切换主题会立即重绘该屏幕。在 Light 和 Dark 之间切换时，会要求 AI 重新设计该屏幕，方式与 AI 编辑相同。生成正在进行时，此菜单不可用。

​
编辑主题

在 Home 页面的 Themes 部分打开主题。主题编辑器会显示主题的实时预览，右侧为 Theme settings。使用顶部的 Light 和 Dark 按钮切换预览，点击主题名称即可重命名。
  • Colors（颜色）：每个颜色组都有一个浅色色块和一个深色色块，包括 Primary、Secondary、Accent、Muted、Destructive、Background、Card、Popover、Border、Input、Ring、Charts 和 Sidebar。点击色块即可编辑其颜色（例如某个颜色组的填充色和文字色），可使用取色器或十六进制值。
  • Radius（圆角）：选择一个圆角级别（Square、Slight、Balanced、Soft 或 Round），或选择 Custom 并拖动 Base radius 来设置自定义值。
您的编辑会先保存为草稿，因此您在编辑时屏幕不会发生变化。准备就绪后：
  • 点击 Publish 以更新所有使用该主题的屏幕。Flowstep 会确认：“Published. Screens using this theme are updating.”（已发布，使用此主题的屏幕正在更新。）
  • 点击 Reset changes 以放弃未发布的更改。使用该主题的屏幕不受影响。
如需删除主题，请点击 Theme settings 底部的 Delete theme，或点击 Home 页面 Themes 列表中主题旁边的垃圾桶图标。被删除的主题不再出现在主题菜单中，但正在使用它的屏幕会保留其外观，因此画布上的内容不会发生变化。
组织中除 Guest（访客）以外的所有人都可以编辑和删除主题。

​
将颜色和圆角关联到主题

颜色和圆角可以指向主题令牌，而不是固定值。关联的值会跟随屏幕的主题变化。当主题发生变化（切换为其他主题、发布编辑，或在浅色与深色之间切换）时，关联的颜色和圆角也会随之更新。 Colors：在 Fill 或 Border 面板中，点击颜色色块。在 Token 标签页中，搜索或从 Theme、Base 或 Tailwind 组中选择令牌。如需精确颜色，请使用 Custom 标签页。关联的颜色会在面板中显示其令牌名称，您仍可以调整其不透明度。 Corners：在 Corners 面板中，点击圆角预览。在 Token 标签页中选择一个级别（例如 md 或 lg）；在 Custom 标签页中以像素为单位输入精确值。关联的圆角会显示其令牌名称，更改主题的圆角设置会重新调整它。 如需将关联值恢复为固定值，请点击 Detach from token。颜色或圆角会保持当前外观，但不再跟随主题。

​
注意事项

  • 屏幕保留各自的主题：每个屏幕都会记住其主题和外观。更改文件的主题只影响您接下来生成的屏幕。如需重新设计现有屏幕，请使用每个屏幕的 Theme 菜单。
  • 仅显示已发布版本：屏幕显示主题的已发布版本。草稿仅在主题编辑器中可见，直到您发布为止。
  • 令牌链接在编辑后保持有效：阴影、滤镜和渐变中使用的主题颜色，在 Flowstep 编辑或重新生成屏幕时仍会与主题保持关联。
  • 不随主题缩放的圆角级别：none 和 full 圆角令牌始终分别为方形和完全圆形，与主题的圆角设置无关。