Metro风格的Windows 8应用程序是否有“标准”平铺颜色列表?

时间:2012-07-20 11:55:53

标签: windows-8 microsoft-metro

当我查看Windows 8安装的开始屏幕时,我看到捆绑的应用程序具有来自某些标准(?)调色板的颜色:IE和Weather具有相同的颜色,Store和Xbox Live游戏,人物和音乐,消息和地图等似乎大多数这些应用程序之间没有任何逻辑连接。然而,他们的瓷砖共享颜色很可能来自一些标准化的调色板。

但是当我们在Visual Studio中创建Metro应用程序时,背景颜色在自由格式文本字段中预设为#464646。所以我想知道是否有一些“官方”的预定义颜色列表,我们可以使用它来使我们自己的磁贴“原生”到Windows 8?

显然我可以截取屏幕并从捆绑的瓷砖中选择颜色,但必须有更好的方法,到目前为止我找不到它。

编辑:显然你甚至无法从截图中选择颜色,因为操作系统会自动对其应用渐变:

  

如果您在图片中使徽标周围的空间透明,那么您应用的品牌颜色(在清单中声明)将显示为预先应用的渐变,作为Windows 8 Release Preview外观的一部分。   http://msdn.microsoft.com/en-us/library/windows/apps/hh465403.aspx#using_default_tiles

7 个答案:

答案 0 :(得分:127)

https://skydrive.live.com/view.aspx?resid=40CFFDE85F1AB56A!1284幻灯片55

上查看我的地铁设计指南演示文稿

颜色是:

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

答案 1 :(得分:31)

引用的演示文稿中的颜色实际上是Windows Phone主题颜色。 Windows 8核心颜色与手机颜色不同。我刚刚发布了一篇关于Windows 8中的磁贴和“开始屏幕”颜色的博客文章。您可能会发现它很有用。 http://www.creepyed.com/2012/09/windows-8-colors-hex-code/。我希望它有所帮助!

答案 2 :(得分:8)

真的好项目。具有所有Windows 8颜色。 http://metrocolours.softwareportalplus.com/

答案 3 :(得分:3)

很抱歉发布到一个旧帖子但我想很多来自搜索引擎的人会觉得这很有用。 这是我为客户创建“地铁灵感”设计时发现的地铁色彩的绝佳资源。

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

所有颜色和颜色代码都包括HEX,RGB,CMYK等。

答案 4 :(得分:1)

如果您需要,可以使用Windows Phone 8的官方列表:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff402557(v=vs.105).aspx

答案 5 :(得分:0)

<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>

答案 6 :(得分:0)

我知道这是一个古老的问题...但仍然想要贡献.. Here是瓷砖和瓷砖颜色的链接和直观表示......