如何获取Plotly-Dash中Bootstrap Lumen主题的默认数据颜色？

方法一：解析dbc.min.css文件提取颜色值 #

Lumen主题的错误（红）、警告（黄）、有效（绿）色调对应Bootstrap的danger、warning、success状态类，这些颜色定义在你引入的dbc.min.css文件中，可通过Python正则匹配提取：

本地CSS文件的情况

import re

# 读取本地的dbc.min.css文件
with open('dbc.min.css', 'r', encoding='utf-8') as f:
    css_content = f.read()

# 匹配.text-danger、.text-warning、.text-success对应的颜色值
color_pattern = r'\.(text-danger|text-warning|text-success)\{color:([^;]+);'
matches = re.findall(color_pattern, css_content)

# 整理为易读的字典格式
theme_colors = {match[0].split('-')[1]: match[1] for match in matches}
print(theme_colors)
# 输出示例（Lumen主题实际值）：{'danger': '#d9534f', 'warning': '#f0ad4e', 'success': '#5cb85c'}

在线CDN引入CSS的情况

如果是通过CDN引入Lumen主题的CSS，先获取文件内容再匹配：

import requests
import re

# Lumen主题的Bootswatch CDN地址
css_url = 'https://cdn.jsdelivr.net/npm/bootswatch@5.3.0/dist/lumen/bootstrap.min.css'
response = requests.get(css_url)
css_content = response.text

# 匹配CSS变量或状态类颜色
var_pattern = r'--bs-(danger|warning|success):([^;]+);'
matches = re.findall(var_pattern, css_content)
theme_colors = {match[0]: match[1] for match in matches}
print(theme_colors)

方法二：利用Dash Bootstrap Components的主题资源 #

Dash Bootstrap Components默认集成了Bootswatch主题，可直接通过主题URL解析颜色变量，无需手动找CSS文件：

import requests
import re
import dash_bootstrap_components as dbc

# 获取Lumen主题的官方CDN地址
css_url = dbc.themes.LUMEN
response = requests.get(css_url)
css_content = response.text

# 提取Bootstrap状态色变量
var_pattern = r'--bs-(danger|warning|success):([^;]+);'
matches = re.findall(var_pattern, css_content)
theme_colors = {match[0]: match[1] for match in matches}

应用到Plotly图表 #

提取到颜色后，直接在图表中使用即可保持风格统一：

import plotly.graph_objects as go

fig = go.Figure()
fig.add_trace(go.Bar(
    x=['错误'], y=[12], 
    marker_color=theme_colors['danger'], 
    name='错误'
))
fig.add_trace(go.Bar(
    x=['警告'], y=[7], 
    marker_color=theme_colors['warning'], 
    name='警告'
))
fig.add_trace(go.Bar(
    x=['有效'], y=[25], 
    marker_color=theme_colors['success'], 
    name='有效'
))

# 配合Lumen主题的浅色风格，使用plotly_white模板
fig.update_layout(template='plotly_white')

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