Is there a list of "standard" Tile colors for Metro style Windows 8 apps?

Windows 8Microsoft Metro

Windows 8 Problem Overview


When I look at the start screen of my Windows 8 installation I see that bundled apps have colors from some standard(?) palette: IE and Weather have the same color, Store and Xbox Live Games, People and Music, Messaging and Maps, etc. It doesn't look like there's any logical connection between most of these apps. Yet their tiles share colors most likely coming from some standardized palette.

But when we create a Metro app in Visual Studio the Background color is preset to #464646 in a free form text field. So I wonder if there's some "official" list of the predefined colors we can use to make our own tiles "native" to Windows 8?

Obviously I can take a screenshot and pick a color from a bundled tile, but there has to be a better way and I've failed to find it so far.

Edit: apparently you can't even pick the color from a screenshot since a gradient is automatically applied to it by the OS:

> If you make the space around the logo itself transparent in your image, your app's brand color (declared in the manifest) will show through with a gradient preapplied to it as part of the Windows 8 Release Preview look. http://msdn.microsoft.com/en-us/library/windows/apps/hh465403.aspx#using_default_tiles

Windows 8 Solutions


Solution 1 - Windows 8

Check my Metro Design Guideline presentation at https://skydrive.live.com/view.aspx?resid=40CFFDE85F1AB56A!1284 slide 55

The colors are:

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

Solution 2 - Windows 8

the colors from the presentation referenced are actually the Windows Phone theme colors. The Windows 8 core colors are different from the phone colors. I just published a blog post about the tile and Start Screen colors in Windows 8. You might find it useful. http://www.creepyed.com/2012/09/windows-8-colors-hex-code/. I hope it helps!

Solution 3 - Windows 8

Really good project. Features all Windows 8 Colors. http://metrocolours.softwareportalplus.com/

Solution 4 - Windows 8

Sorry for posting to an old thread but I guess many who comes from search engines will find this useful. This is a great resource on metro colors that I discovered when creating "metro inspired" design for my client.

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

All colors and color codes are there including HEX, RGB, CMYK, etc.

Solution 5 - Windows 8

There is an official list for the Windows Phone 8 if you want:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff402557(v=vs.105).aspx

Solution 6 - Windows 8

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

Solution 7 - Windows 8

I know its an old question... But still want to contribute.. Here is a link and visual representation of tile and tile color.....

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAlan MendelevichView Question on Stackoverflow
Solution 1 - Windows 8LBugnionView Answer on Stackoverflow
Solution 2 - Windows 8creepyedView Answer on Stackoverflow
Solution 3 - Windows 8MetroVistaView Answer on Stackoverflow
Solution 4 - Windows 8PuikinshView Answer on Stackoverflow
Solution 5 - Windows 8RolandView Answer on Stackoverflow
Solution 6 - Windows 8seysaneView Answer on Stackoverflow
Solution 7 - Windows 8grv_9098View Answer on Stackoverflow