一休らしい没頭感を促すカラーリングとして定義した、サービスごとに象徴されるブランドカラーに対して、
特定のアクションやステータスを表す機能的な意味を持つカラーはポジティブな色味で定義しています。
サービス全体で一貫性を保ち、ユーザーの学習コストを軽減します。
有彩色12色(うち2色を2階調)、無彩色8階調で定義します。
プロダクトに反映する際は以下の有彩色の中から選定し、使用箇所は問いません。
有彩色
#ff3131
#fff2f2
#ff6600
#ff9900
#ffcc00
#9ba50e
#00b900
#4ebaeb
#008dde
#1e72ef
#eff7ff
#1f559a
#6e44c2
無彩色
#333333
#696969
#999999
#aaaaaa
#cccccc
#dddddd
#eeeeee
#f7f7f7
色の使用箇所はサービス全体を通して決まっており、定義した箇所以外での使用は原則認めません。
使用箇所
css
ダイヤモンド会員ラベル
background: linear-gradient(45deg,#0c7b8e,#54acb9);
ゴールド会員ラベル/
ランキング1位
background: linear-gradient(45deg,#a88304,#d6b604);
プラチナ会員ラベル/
ランキング2位
background: linear-gradient(45deg,#777777,#c4c4c4);
ランキング3位
background: linear-gradient(45deg, #844c00, #ac7318);
レギュラー会員ラベル
background: linear-gradient(45deg,#d27d07,#ffb44d);
クーポン
background: linear-gradient(45deg,#907600,#a89300);
モーダルの背景色
background: rgba(0, 0, 0, 0.6);