无自定义CSS时修改Notion嵌入Mermaid类图背景与边框颜色

Notion的Mermaid渲染支持原生配置语法，不需要自定义CSS就能修改画布、类块的背景和边框颜色，有两种可直接落地的实现方式：

全局统一配色方案 #

直接在代码开头的init配置块里，通过themeVariables覆盖类图的默认色值即可，注意要把主题从dark改成base作为自定义基底，否则默认深色主题的内置色会覆盖你的自定义配置。
支持配置的核心色值参数：

• classDiagram.background：整个类图画布的背景色
• classDiagram.classBackground：所有类块的默认填充背景色
• classDiagram.classBorder：所有类块的默认边框颜色
• classDiagram.classText：类块内的文字颜色

示例代码（可直接替换使用）：

%%{init: {
  'theme': 'base',
  'themeVariables': {
    'classDiagram.background': '#f3f4f6',
    'classDiagram.classBackground': '#ffffff',
    'classDiagram.classBorder': '#2563eb',
    'classDiagram.classText': '#111827'
  }
}}%%
classDiagram

class Company {
    id: string
    cognito_sub: string
    first_name: string
    last_name: string
    phone: Phone
    email: string
    tax_code: string
    birth_date: number
    birth_place: string
    img_url: string
    origin: string
    status: CustomerStatus
    note: Note[]
    created_at: number
    updated_at: number
}

注：示例里已经修正了你原代码中last_name字段错误的缩进问题，避免渲染错位。

单个类独立配色方案 #

如果只需要给特定类（比如当前的Company类）单独设置背景、边框色，不需要改动全局配色，可以用Mermaid原生的classDef语法定义样式规则，再绑定到目标类上，即使保留原来的dark主题也能生效。
示例代码：

%%{init: {'theme': 'dark'}}%%
classDiagram

class Company {
    id: string
    cognito_sub: string
    first_name: string
    last_name: string
    phone: Phone
    email: string
    tax_code: string
    birth_date: number
    birth_place: string
    img_url: string
    origin: string
    status: CustomerStatus
    note: Note[]
    created_at: number
    updated_at: number
}
%% 定义样式规则：fill=背景色 stroke=边框色 stroke-width=边框宽度 color=文字色
classDef companyStyle fill:#1e3a8a,stroke:#93c5fd,stroke-width:2px,color:#eff6ff
%% 把样式绑定到Company类
class Company companyStyle

配置说明：所有颜色值支持十六进制色码、rgb()、rgba()格式，直接替换成你需要的色值即可，不需要引入任何外部资源、不需要写自定义CSS，粘贴到Notion的Mermaid代码块中就能直接渲染生效。

内容的提问来源于stack exchange，提问作者gio