web-dev-qa-db-ja.com

MetroスタイルWindows 8アプリの「標準」タイルカラーのリストはありますか?

Windows 8のインストールの開始画面を見ると、バンドルされているアプリには標準(?)パレットの色があります。IEとWeatherは同じ色、StoreとXbox Liveゲーム、これらのアプリのほとんどは論理的なつながりがあるようには見えませんが、タイルは標準化されたパレットの色を共有している可能性があります。

ただし、Visual StudioでMetroアプリを作成すると、自由形式のテキストフィールドで背景色が#464646にプリセットされます。だから、私たちが独自のタイルをWindows 8の「ネイティブ」にするために使用できる定義済みの色の「公式」リストがあるのだろうか?

明らかに、スクリーンショットを撮って、バンドルされたタイルから色を選ぶことができますが、より良い方法が必要であり、今のところ見つけることができませんでした。

編集:OSによってグラデーションが自動的に適用されるため、スクリーンショットから色を選択することもできないようです:

画像のロゴ自体の周囲のスペースを透明にすると、アプリのブランドカラー(マニフェストで宣言)が透けて見え、Windows 8 Release Previewの外観の一部としてグラデーションが事前に適用されます。 http://msdn.Microsoft.com/en-us/library/windows/apps/hh465403.aspx#using_default_tiles

62

https://skydrive.live.com/view.aspx?resid=40CFFDE85F1AB56A!1284 スライド55のMetro Design Guidelineプレゼンテーションを確認してください。

色は次のとおりです。

PURPLE
RGB 162 0 255
A200FF

Magenta
RGB 255 0 151
FF0097

TEAL
RGB 0 171 169
00ABA9

Lime
RGB 140 191 38
8CBF26

BROWN
RGB 160 80 0
A05000

PINK
RGB 230 113 184
E671B8

ORANGE
RGB 240 150 9
F09609

BLUE
RGB 27 161 226
1BA1E2

RED
RGB 229 20 0
E51400

GREEN
RGB 51 153 51
339933
127
LBugnion

参照されるプレゼンテーションの色は、実際にはWindows Phoneテーマの色です。 Windows 8のコアカラーは、電話の色とは異なります。 Windows 8のタイルとスタート画面の色についてのブログ記事を公開しました。これは役に立つかもしれません。 http://www.creepyed.com/2012/09/windows-8-colors-hex-code/ 。私はそれが役立つことを願っています!

31
creepyed

本当に良いプロジェクト。すべてのWindows 8カラーを備えています。 http://metrocolours.softwareportalplus.com/

8
MetroVista

古いスレッドに投稿してすみませんが、検索エンジンから来た人の多くはこれが便利だと思うでしょう。これは、クライアントのために「メトロにインスパイアされた」デザインを作成するときに発見したメトロカラーに関する素晴らしいリソースです。

http://colorlib.com/etc/metro-colors

HEX、RGB、CMYKなど、すべての色とカラーコードがあります。

3
Puikinsh

必要に応じて、Windows Phone 8の公式リストがあります。
http://msdn.Microsoft.com/en-us/library/windowsphone/develop/ff402557(v = vs.105).aspx

1
Roland
<style>
.Color-Purple {background: #8C0095 }
.Color-Purple:hover {background: #A700AE }

.Color-DarkPurple {background: #5133AB }
.Color-DarkPurple:hover {background: #643EBF }

.Color-Teal {background: #008299 }
.Color-Teal:hover {background: #00A0B1 }


.Color-Orange {background: #D24726 }
.Color-Orange:hover {background: #DC572E }

.Color-Blue {background: #2672EC }
.Color-Blue:hover {background: #2E8DEF }

.Color-SkyBlue {background: #094AB2 }
.Color-SkyBlue:hover {background: #0A5BC4 }

.Color-Red {background: #AC193D }
.Color-Red:hover {background: #BF1E4B }

.Color-Green {background: #008A00 }
.Color-Green:hover {background: #00A600 }

.Color-Yellow {background: #e8be1b }
.Color-Yellow:hover {background: #f7d240 }
</style>
0
seysane

私はその古い質問を知っています...しかし、まだ貢献したい.. Here は、タイルとタイルの色のリンクと視覚的表現です。

0
grv_9098