Pre-defined system styles and resources in Windows Phone 7
Windows Phone 7 is based on the Metro UI and if you develop for this platform, then you probably want your application to be as consistent as possible with the main UI. To achieve this, many developers try guessing font styles and colors. The problem comes when the end-user decides to change some settings, like, for example, the accent color. If the color itself is hard-coded in the application, then chances are that it won’t look nothing like the main UI. So what is the solution? Using pre-defined styles and resources that come bundled with the system is the way to go.
Here is a complete list of what those are, and you can use this article as a cheat-sheet when developing Windows Phone 7 applications.
Color Styles
Key: PhoneBackgroundColor
Default actual value: #FF1F1F1F

Key: PhoneContrastForegroundColor
Default actual value: Black

Key: PhoneForegroundColor
Default actual value: White

Key: PhoneInactiveColor
Default actual value: #FF666666

Key: PhoneDisabledColor
Default actual value: #FF808080

Key: PhoneSubtleColor
Default actual value: #FF999999

Key: PhoneContrastBackgroundColor
Default actual value: #FFFFFFFF

Key: PhoneTextBoxColor
Default actual value: #FFBFBFBF

Key: PhoneBorderColor
Default actual value: #FFCCCCCC

Key: PhoneTextSelectionColor
Default actual value: Black

Key: PhoneAccentColor
Default actual value: #FF1BA1E2

Brush Styles
Key: PhoneAccentBrush
Color: PhoneAccentColor
Key: PhoneBackgroundBrush
Color: PhoneBackgroundColor
Key: PhoneContrastForegroundBrush
Color: PhoneContrastForegroundColor
Key: PhoneForegroundBrush
Color: PhoneForegroundColor
Key: PhoneInactiveBrush
Color: PhoneInactiveColor
Key: PhoneDisabledBrush
Color: PhoneDisabledColor
Key: PhoneSubtleBrush
Color: PhoneSubtleColor
Key: PhoneContrastBackgroundBrush
Color: PhoneContrastBackgroundColor
Key: PhoneTextBoxBrush
Color: PhoneTextBoxColor
Key: PhoneBorderBrush
Color: PhoneBorderColor
Key: PhoneTextSelectionBrush
Color: PhoneTextSelectionColor
Key: TransparentBrush
Color: Transparent
Font Families
Key: PhoneFontFamilyNormal
Actual font: Segoe WP

Key: PhoneFontFamilyLight
Actual font: Segoe WP Light
![]()
Key: PhoneFontFamilySemiLight
Actual font: Segoe WP Semilight
![]()
Key: PhoneFontFamilySemiBold
Actual font: Segoe WP Semibold
![]()
Font Sizes
Key: PhoneFontSizeSmall
Double value: 18.667
Point value: 14pt
![]()
Key: PhoneFontSizeNormal
Double value: 20
Point value: 15pt
![]()
Key: PhoneFontSizeMedium
Double value: 22.667
Point value: 17pt
![]()
Key: PhoneFontSizeMediumLarge
Double value: 25.333
Point value: 19pt
![]()
Key: PhoneFontSizeLarge
Double value: 32
Point value: 24pt

Key: PhoneFontSizeExtraLarge
Double value: 42.667
Point value: 32pt
![]()
Key: PhoneFontSizeExtraExtraLarge
Double value: 72
Point value: 54pt

TextBlock Styles
Key: PhoneTextNormalStyle
FontFamily: PhoneFontFamilyNormal
FontSize: PhoneFontSizeNormal
Foreground: PhoneForegroundBrush
![]()
Key: PhoneTextTitle1Style
FontFamily: PhoneFontFamilySemiLight
FontSize: PhoneFontSizeExtraExtraLarge
Foreground: PhoneForegroundBrush
Key: PhoneTextSubtleStyle
FontFamily: PhoneFontFamilyNormal
FontSize: StaticResource PhoneFontSizeNormal
Foreground: PhoneSubtleBrush

Key: PhoneTextTitle2Style
FontFamily: PhoneFontFamilySemiLight
FontSize: PhoneFontSizeLarge
Foreground: PhoneForegroundBrush

Key: PhoneTextTitle3Style
FontFamily: StaticResource PhoneFontFamilySemiLight
FontSize: PhoneFontSizeMedium
Foreground: PhoneForegroundBrush
![]()
Key: PhoneTextExtraLargeStyle
FontFamily: PhoneFontFamilySemiLight
FontSize: PhoneFontSizeExtraLarge
Foreground: PhoneForegroundBrush

Key: PhoneTextGroupHeaderStyle
FontFamily: PhoneFontFamilySemiLight
FontSize: PhoneFontSizeLarge
Foreground: PhoneSubtleBrush

Key: PhoneTextLargeStyle
FontFamily: PhoneFontFamilySemiLight
FontSize: PhoneFontSizeLarge
Foreground: PhoneForegroundBrush
![]()
Key: PhoneTextSmallStyle
FontFamily: PhoneFontFamilyNormal
FontSize: PhoneFontSizeSmall
Foreground: PhoneSubtleBrush

Key: PhoneTextContrastStyle
FontFamily: PhoneFontFamilySemiBold
FontSize: PhoneFontSizeNormal
Foreground: PhoneContrastForegroundBrush

Key: PhoneTextAccentStyle
FontFamily: PhoneFontFamilySemiBold
FontSize: PhoneFontSizeNormal
Foreground: PhoneAccentBrush

You can download the PDF here.
(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)



