カテゴリー:
Material Design
閲覧数:526 配信日:2022-03-19 09:51
Color - Style
Googleは、(濃度)500(の)色をアプリ原色(Primary color)として使用し、その他の色をアクセントカラーとして使用することを推奨しています。
Color - Style原色(Primary color) とは？
原色(Primary colorは、アプリの画面やコンポーネントで最も頻繁に表示される色です。
2次色がない場合は、要素のアクセントとして使用することもできます。
要素間にコントラストをつけるには、原色を薄くしたり濃くしたりします。明るい色と暗い色のコントラストは、ステータスバーとツールバーのように、表面と表面の間に区切りを示すのに役立ちます。
この配色は、原色の異なる色調を含んでおり、より明るいまたはより暗いコントラストが必要な場合に使用します。
「Material Design 2014 年」の原色(Primary color)となる濃度500の色は、20 色
| 英語 | 日本語 | カラーコード |
|---|---|---|
| Red | 赤 | #F44336 |
| Pink | ピンク | #E91E63 |
| Purple | 紫 | #9C27B0 |
| Deep Purple | 深紫 | #673AB7 |
| Indigo | 紺 | #3F51B5 |
| Blue | 青 | #2196F3 |
| Light Blue | ライトブルー | #03A9F4 |
| Cyan | シアン | #00BCD4 |
| Teal | 緑青 | #009688 |
| Green | 緑 | #4CAF50 |
| Light Green | ライトグリーン | #8BC34A |
| Lime | ライム | #CDDC39 |
| Yellow | 黄 | #FFEB3B |
| Amber | 琥珀 | #FFC107 |
| Orange | オレンジ | #FF9800 |
| Deep Orange | ディープオレンジ | #FF5722 |
| Brown | 茶 | #795548 |
| Grey | グレー | #9E9E9E |
| Blue Grey | ブルーグレー | #607D8B |
| Black | 黒 | #000000 |
・マテリアルカラーをランダムに3色取得 ／ 重複も許容