当前位置:首页 > draw.io教程

使用自适应颜色在浅色和深色模式下绘制图表

drawio1年前 (2025-02-07)draw.io教程8

在 draw.io 中从浅色模式切换到深色模式时,颜色会自动调整深浅,使图表及其标签更易于阅读。现在,您可以通过更新后的调色板,为浅色和深色模式下的形状、连接线、文本和图表页面背景设置特定的颜色。

当您的团队中有一部分人喜欢在深色模式下工作,而另一部分人喜欢在浅色模式下工作时,自适应颜色就显得非常重要。

颜色风格——使用特定的深色和浅色

  1. 选择一个或多个形状、连接线、文本标签或图表背景,然后单击颜色块打开调色板,例如,形状的 填充颜色。

  2. 点击“高级”按钮,即可在调色板中查看深色模式颜色设置。

  3. 在“浅色模式”(太阳)字段中输入颜色值。如果您启用了“自动自适应颜色”设置,则“深色模式”值将自动更新为其反色。

  4. 要使用特定的深色模式颜色,请在“深色模式”字段(月亮)中输入不同的颜色值。此颜色现在由用户自定义

  5. 单击“应用”将颜色样式保存到您选择的形状、连接线、文本或图表页面背景。

你会注意到,无论在深色模式还是浅色模式下,色块现在都有两个三角形。

提示:要在深色和浅色模式下使用相同的颜色,请在两个字段中输入相同的值。

自适应颜色设置

多页图表中的每一页都有自己的自适应颜色设置。

在图表页面中未选中任何内容的情况下,单击“图表样式”选项卡。更改“自适应颜色”设置。或者,从菜单中 选择“附加功能”>“自适应颜色” 。

  • 自动:调整强度以增强图表中所有彩色元素的对比度。此设置默认为启用状态。

  • 简单来说:仅增强黑白元素的对比度,保留所有其他颜色。因此,同一调色板可用于深色和浅色模式。

  • 无:完全禁用深色模式下的自适应颜色。即使您在 draw.io 编辑器中启用了深色模式,图表仍将以浅色模式下的颜色显示。

defaultAdaptiveColors在 draw.io 配置中设置,即可simple使none图表颜色在浅色和深色模式下保持一致。

步骤详解: 配置默认自适应颜色

共享具有自适应颜色的图表

自适应颜色设置保存在图表文件中。当您共享图表文件(例如包含图表的 URL 链接或嵌入图表的 HTML 代码)时,当在编辑器中重新打开图表时,图表将以保存时的自适应颜色设置显示。