视觉自定义

使用本节中的选项来自定义 B2CORE UI 的外观，以体现您品牌的独特风格。

资源

在此页面上，您可以上传或修改 B2CORE UI 中显示的徽标，以及注册和登录页面的背景图片（如有需要）。

浅色主题徽标

启用浅色主题时，B2CORE UI 中显示的主徽标。

要求格式：带透明背景的 SVG，文件大小最大为 10 MB。

浅色主题简短徽标

在浅色主题下主菜单折叠时显示的紧凑版徽标。

要求格式：带透明背景的 SVG，文件大小最大为 10 MB。

深色主题徽标

启用深色主题时，B2CORE UI 中显示的主徽标。

要求格式：带透明背景的 SVG，文件大小最大为 10 MB。

深色主题简短徽标

在深色主题下主菜单折叠时显示的紧凑版徽标。

要求格式：带透明背景的 SVG，文件大小最大为 10 MB。

网站图标 (.ico)

浏览器标签页中显示的小图标。

要求格式：ICO，文件大小最大为 10 MB。

网站图标 (.svg)

供支持 SVG 的浏览器使用的网站图标矢量版本。

要求格式：SVG，文件大小最大为 10 MB。将用作可缩放图标。

Apple 触控图标

在 Apple 设备上将 B2CORE UI 页面添加到主屏幕时显示的图标。

要求格式：PNG，180×180 像素，文件大小最大为 10 MB。

浅色主题背景

启用浅色主题时应用于注册和登录页面的背景图片。添加背景图片为可选操作。

推荐格式：SVG、JPG 或 PNG，文件大小最大为 10 MB。

深色主题背景

启用深色主题时应用于注册和登录页面的背景图片。添加背景图片为可选操作。

推荐格式：SVG、JPG 或 PNG，文件大小最大为 10 MB。

管理面板图片

在本节中，您可以上传 Back Office 中显示的图片（推荐格式：JPG、PNG 或 SVG，文件大小最大为 10 MB）：

• 菜单徽标 — 在 Back Office 主菜单中显示的徽标
• 登录页面徽标 — 在 Back Office 登录页面中显示的徽标
• 登录页面背景 — 应用于 Back Office 登录页面的背景图片

配色方案

在此页面上，自定义 B2CORE UI 浅色和深色主题的颜色设置。

在品牌配置部分，您可以通过指定品牌颜色并启用着色背景选项来快速设置品牌标识，该选项会将品牌颜色的浅色调应用于界面背景。

下文所述各个界面元素的颜色设置可在高级颜色设置部分中找到。

已启用浅色主题

选中复选框以启用 B2CORE UI 的浅色主题。

如果两种主题均已启用，请启用默认选项以将浅色主题设为默认主题。

已启用深色主题

选中复选框以启用 B2CORE UI 的深色主题。

如果两种主题均已启用，请启用默认选项以将深色主题设为默认主题。

高级颜色设置分为语义令牌 V1（浅色 / 深色）和语义令牌 V2（浅色 / 深色）部分，允许您分别为浅色和深色主题自定义每个颜色令牌。若要将颜色令牌重置为从您的品牌颜色派生的值，请点击从品牌重置颜色按钮。

**语义令牌 V1（浅色 / 深色）**部分包含以下令牌组：

• 强调色 — accent, accentHover, accent40, accent10, demo
• 状态 — positive, positive20, medium, medium20, negative, negative20
• 表面 — background, background96, card, field, disabled, overlay, tooltip, divider
• 文本 — textMain, textSecondary, textSecondary40, textContrast

**语义令牌 V2（浅色 / 深色）**部分包含以下令牌组：

• 强调色 — brand, brandSubtle, brandMuted, alternative, alternativeSubtle, alternativeMuted, positive, positiveSubtle, positiveMuted, medium, mediumSubtle, mediumMuted, negative, negativeSubtle, negativeMuted, neutral, overlay, overlaySubtle, overlayMuted
• 字符 — onSurface, onSurfaceSecondary, onSurfaceInverse, onBrand, onAlternative, onPositive, onMedium, onNegative, onNeutral, onOverlay, onSurfaceBrand, onSurfaceAlternative, onSurfacePositive, onSurfaceMedium, onSurfaceNegative, onSurfaceOverlay
• 表面 — surfaceLow, surface, surfaceHigh, surfaceHighest, surfaceInverse, backdrop
• 轮廓 — outline, outlineStrong
• 状态 — stateHovered, statePressed, stateHoveredInverse, statePressedInverse, stateDarken, stateDarkenStrong

其他浅色/深色主题变量 (json)

使用此字段指定包含额外变量的 JSON 对象，例如定义背景图片在相应主题中行为的变量：

{
"optional-external-bg-position": "0 0",
"optional-external-bg-size": "cover",
"optional-external-bg-repeat": "no-repeat",
"optional-external-bg-attachment": "fixed"
}

"optional-external-bg-position": "0 0"

将背景图片定位在左上角。

"optional-external-bg-size": "cover"

缩放背景图片以覆盖整个页面。

"optional-external-bg-repeat": "no-repeat"

防止背景图片向任何方向重复（平铺）。

"optional-external-bg-attachment": "fixed"

在滚动页面时保持背景图片固定不动。它不会随内容移动。

字段

在此页面上，您可以指定其他自定义字段。

项目名称

您的项目名称，将显示在 B2CORE UI 中。

脚本 (js-script)

在此处添加您的 JavaScript (JS) 脚本。当客户打开注册或登录页面时，这些脚本将自动执行。