Serendie Design System

AboutGet StartedFoundationsComponents
© Mitsubishi Electric Corporation

データビジュアライゼーション

基本カラーパレットを拡張する形で、データ可視化用のカラーパレットをシステムトークンとして提供しています。凡例や目盛りなどチャートに関連するシステムトークンも合わせて定義しています。

更新 2025/7/17

Mark

Single(単色相)

チャート本体に使用する単色相のカラーパレットです。データ数が3以下の場合は偶数のカラーを使用してください。

sd.system.color.chart.mark.primary

010203040506
Primary/Konjo
Primary/Kurikawa
Primary/Tsutsuji
Primary/Sumire
Primary/Asagi

Semantic

成功やエラー、注意など、データに特定の意味や目的を持たせる場合はSemanticカラーパレットを使用してください。データ数が入れ子の場合は階層別にカラーを使用してください。

sd.system.color.chart.mark

010203040506
Positive
Negative
Notice

Multi(複数色相)

チャート本体に使用する複数色相のカラーパレットです。各色を個別に分類が認識できるように、パレットの番号の順番に従って使用してください。

sd.system.color.chart.mark.multi

01020304050607080910
Multi

Component

チャート内での目盛やラベルなど、マーク(チャート本体)以外の要素はこちらのパレットを使用してください。

sd.system.color.chart.component

chartSurface
onChartSurface
onMarkLabel
inverseOnMarkLabel
scalemark
threshold