Material Designはさまざまな色を定義しています。これらはビジュアライゼーションに使用されます。可能であれば、色値を使用して色を宣言することをお勧めします。これにより、コントラストとデザインが後で一致することが保証されます。特に、明るいデザインから暗いデザインに切り替える際にテキストが読み取れなくなる可能性があるため、この点には特別な注意を払う必要があります。
ヒント: プロジェクト設定の「ビジュアライゼーション」タブで色を変更できます。これにより、個別のデザインを作成できます。
これらはビジュアライゼーションのすべての可能な背景色です。
| 名前 | 値 | 色 | テキスト色 |
|---|---|---|---|
| 赤 | red | #D32F2F | #FFFFFF |
| ピンク | pink | #C2185B | #FFFFFF |
| 紫 | purple | #7B1FA2 | #FFFFFF |
| 深紫 | deep_purple | #512DA8 | #FFFFFF |
| インディゴブルー | indigo | #303F9F | #FFFFFF |
| 青 | blue | #1976D2 | #FFFFFF |
| 淡い青 | light_blue | #0288D1 | #FFFFFF |
| ターコイズ | cyan | #0097A7 | #FFFFFF |
| シーグリーン | teal | #00796B | #FFFFFF |
| 緑 | green | #388E3C | #FFFFFF |
| 淡い緑 | light_green | #689F38 | #FFFFFF |
| ライムグリーン | lime | #AFB42B | #000000 |
| 黄色 | yellow | #FBC02D | #000000 |
| アンバー | amber | #FFA000 | #000000 |
| オレンジ | orange | #F57C00 | #000000 |
| 深いオレンジ | deep_orange | #E64A19 | #FFFFFF |
| エラー | error | #B00020 | #FFFFFF |
これらの色は、十分なコントラストを提供するためにテキストや図面上のシンボルに使用することをお勧めします。
| 名前 | 値 | 色 | テキスト色 |
|---|---|---|---|
| 赤 | red | #F44336 | #FFFFFF |
| ピンク | pink | #E91E63 | #FFFFFF |
| 紫 | purple | #9C27B0 | #FFFFFF |
| 深紫 | deep_purple | #673AB7 | #FFFFFF |
| インディゴブルー | indigo | #3F51B5 | #FFFFFF |
| 青 | blue | #2196F3 | #FFFFFF |
| 淡い青 | light_blue | #03A9F4 | #000000 |
| ターコイズ | cyan | #00BCD4 | #000000 |
| シーグリーン | teal | #009688 | #FFFFFF |
| 緑 | green | #4CAF50 | #000000 |
| 淡い緑 | light_green | #8BC34A | #000000 |
| ライムグリーン | lime | #CDDC39 | #000000 |
| 黄色 | yellow | #FFEB3B | #000000 |
| アンバー | amber | #FFC107 | #000000 |
| オレンジ | orange | #FF9800 | #000000 |
| 深いオレンジ | deep_orange | #FF5722 | #FFFFFF |
| 茶色 | brown | #795548 | #FFFFFF |
| 灰色 | gray | #9E9E9E | #000000 |
| ブルーグレー | blue_gray | #607D8B | #FFFFFF |
| エラー | error | #B00020 | #FFFFFF |