Style Style Style Style Class


Contains property setters that can be shared between instances of a type. A Style is usually declared in a resources collection so that it can be shared and used for applying control templates and other styles.

public : sealed class Style : DependencyObject, IStyle
struct winrt::Windows::UI::Xaml::Style : DependencyObject, IStyle
public sealed class Style : DependencyObject, IStyle
Public NotInheritable Class Style Inherits DependencyObject Implements IStyle
<Style .../>
<Style ...>
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)


This example creates two styles: one for a TextBlock and one for a TextBox. Each style is applied to two instances of a control to create a uniform appearance for each TextBlock and TextBox. The example sets the FrameworkElement.Style property of each control by referencing the Style as a {StaticResource} markup extension.

Each style has multiple Setter parts. In this XAML, no Style.Setters XAML property element appears. That is the typical usage in XAML for this property. The Style.Setters value is implicit, because Setters is the XAML content property for a Style. For more info on XAML syntax and how the XAML content syntax makes it possible to imply and omit certain XAML elements, see XAML syntax guide.

Notice that in the style for the TextBox, the Margin property is set to 4, which means that the TextBox has a margin of 4 on all sides. To compensate for the length of the second TextBlock, which is shorter than the first TextBlock because Last Name takes less room than First Name, a value of "6,4,4,4" is assigned to the Margin property on the second TextBox. This causes the second TextBox to have a different margin than what the style specifies, so that it aligns horizontally with the first TextBox.

    <!--Create a Style for a TextBlock to specify that the
              Foreground equals Navy, FontSize equals 14, and
              VerticalAlignment equals Botton.-->
    <Style TargetType="TextBlock" x:Key="TextBlockStyle">
      <Setter Property="Foreground" Value="Navy"/>
      <Setter Property="FontSize" Value="14"/>
      <Setter Property="VerticalAlignment" Value="Bottom"/>

    <!--Create a Style for a TextBlock that specifies that
              the Width is 200, Height is 20, Margin is 4,
              Background is LightBlue, and FontSize is 14.-->
    <Style TargetType="TextBox" x:Key="TextBoxStyle">
      <Setter Property="Width" Value="200"/>
      <Setter Property="Height" Value="30"/>
      <Setter Property="Margin" Value="4"/>
      <Setter Property="FontSize" Value="14"/>
      <Setter Property="Background">
          <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
            <GradientStop Color="White" Offset="0.0"/>
            <GradientStop Color="LightBlue" Offset="0.5"/>
            <GradientStop Color="Navy" Offset="1"/>

  <!--Apply the TextBlockStyle and TextBoxStyle to each 
          TextBlock and TextBox, respectively.-->
  <StackPanel Orientation="Horizontal">
    <TextBlock Style="{StaticResource TextBlockStyle}">
              First Name:
    <TextBox Style="{StaticResource TextBoxStyle}"/>
  <StackPanel Orientation="Horizontal">
    <TextBlock Style="{StaticResource TextBlockStyle}">
              Last Name:
    <TextBox Style="{StaticResource TextBoxStyle}"

This example creates two style elements. The TargetType for the first style element is set to TextBox and the TargetType for the second style element is set to Button. These are then applied as the implicit style for a TextBox control and a Button control.

        <Style TargetType="TextBox">
            <Setter Property="Foreground" Value="Pink" />
            <Setter Property="FontSize" Value="15" />                
        <Style TargetType="Button">
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="Background" Value="Yellow" />
    <TextBox Height="30" Width="120" Margin="2" Text="TextBoxStyle" />
    <Button Height="30" Width="100" Margin="2" Content="ButtonStyle" />

This example creates a Style named InheritedStyle that is based on a Style named BaseStyle. InheritedStyle inherits the Background value of Yellow from BaseStyle and adds a Foreground value of Red.

        <Style x:Key="BaseStyle" TargetType="Button">
            <Setter Property="Background" Value="Yellow" />
        <!--Create a Style based on BaseStyle-->
        <Style x:Key="InheritedStyle" TargetType="Button" BasedOn="{StaticResource BaseStyle}">
            <Setter Property="Foreground" Value="Red" />
    <!--A button with default style-->
    <Button Content="HelloWorld" />
    <!--A button with base style-->
    <Button Content="HelloWorld" Style="{StaticResource BaseStyle}" />
    <!--A button with a style that is inherited from the BaseStyle-->
    <Button Content="HelloWorld" Style="{StaticResource InheritedStyle}" />


A Style is basically a collection of property settings applied to one or more instances of a particular type that has such properties. A Style contains a collection of one or more Setter objects. Each Setter has a Property and a Value. The Property is the name of the property of the element the style is applied to. The Value is the value that is applied to the property.

In order to apply a Style, the target object must be a DependencyObject. The property that each Setter references as a Property value must be a dependency property.

You must set the TargetType property when you create a Style. Otherwise an exception is thrown.

If you set a value for the same property in a Style and also on an element directly, the value set on the element directly takes precedence. For more info, see Dependency properties overview, specifically the "Dependency property value precedence" section.

Defining a Style as a XAML resource

A Style is almost always defined in XAML as a resource in a ResourceDictionary.

  • For a Style that is used only by other UI items defined in the same XAML page, you typically define the Style in the FrameworkElement.Resources collection (Page.Resources if your root element is a Page ).
  • For a Style that is used by more than one page in your app, you typically define the Style in the Application.Resources collection. Alternatively, you might have a separate XAML file for the app that you include in Application.Resources as a MergedDictionaries value.
  • Most UI elements have a default style that's defined by the Windows Runtime. Copies of the default styles can be seen in the design-helper XAML file called generic.xaml, which isn't technically a resource file for apps although it's structured like one. You can copy discrete parts of this file into your app's XAML as the starting point when you edit copies of styles as enabled by the tools, but once you make such a copy it needs to be included in one of the Resources collections or indirectly accessed through MergedDictionaries. In all these cases the modified XAML that overrides the default is included as part of your app.

Windows 8 If you are re-templating an existing control in Windows 8 XAML, you sometimes modify the Style elements that exist in the StandardStyles.xaml XAML file that is included in most of the starting app templates. StandardStyles.xaml is referenced by the template app.xaml files as a MergedDictionaries source file. Templates for apps starting with Windows 8.1 don't use StandardStyles.xaml anymore.

A Style defined element in a ResourceDictionary is not required to have an x:Key attribute or x:Name attribute, which is normally a requirement of being a XAML resource. A Style that's defined this way uses its TargetType property value as the implicit key and is known as an .

For more info on how to use XAML resource dictionaries, see ResourceDictionary and XAML resource references.

Styles and templates

You can use a Setter in a Style to apply values to any dependency property. But it's the Setter for the Template property of a Control -derived class that constitutes the majority of the XAML markup in a typical Style. The Value for a Setter with Property="Template" is almost always specified as a property element that contains a ControlTemplate object element.

When a Style is used to define a control template, the TargetType of the Style element and the TargetType of the ControlTemplate element for its Control.Template setter should always use the same value.

The Template setter defines the basic template UI definition for a control instance where that template is applied. It also contains the visual states for a control, and other state-based UI definitions such as default theme transitions. For a complex control such as ListBox, the default template Style and the ControlTemplate within can have hundreds of lines of XAML. For more info on the role of Style in control templating scenarios, see Quickstart: Control templates.

The template for a control often includes visual states that change the appearance of the control in response to logical states. For example, a Button can have a different visual appearance when it's pressed by applying a new visual state from its template, and all appearance changes can come from XAML not code. For more info on how visual states work and how to modify them or define states for custom controls, see Storyboarded animations for visual states and Quickstart: Control templates.

Styles and runtime behavior

You can change the values of individual properties that have been set by a Style at run time and your new values overwrite the Setters values. For example, you can set the Template property at run time even if this property has been set by a style.

You can adjust the properties of a Style at run time, but only if that style hasn't been applied to anything, and only exists as a resource that's not being used implicitly. For example, you can add setters to the collection in Setters for a style that exists in Resources with an x:Key attribute but has no {StaticResource} markup extension value elsewhere in XAML that refers to that style. However, as soon as a Style is referenced and used for values by a loaded object, the Style should be considered sealed. You can detect the sealed state by checking the value of the IsSealed property for the Style. If it's true, then the style is sealed and you can't modify any properties of it or the Setter subvalues within. The point in time when a style's been put into use and sealed can also be detected when the object where the Style is referenced raises its Loaded event.

BasedOn styles

You can build a new style based on an existing style that's defined by your app or by default styles for Windows Runtime controls. You can do this using the BasedOn property. This reduces duplication in your XAML and makes it easier to manage resources. Each style supports only one BasedOn style. For more info, see BasedOn or Styling controls.

Implicit styles

You can define styles such that a Style is used implicitly by all objects of the same TargetType, without requiring each instance of such an object to specifically reference the Style as a FrameworkElement.Style value. When a <Style> resource is declared in a ResourceDictionary without an x:Key attribute, the x:Key value uses the value of the TargetType property. If you set the style implicitly, the style is applied only to the types that match the TargetType exactly and not to elements derived from the TargetType value. For example, if you create a style implicitly for all the ToggleButton controls in your application, and your application has ToggleButton and CheckBox controls (CheckBox derives from ToggleButton ), the "ToggleButton" implicit style is applied only to the ToggleButton controls.

Notes on XAML syntax

Setters is the XAML content property for Style, so you can use an implicit collection syntax such as <Style><Setter .../><Setter .../></Style>.

Using the Style class in code (for example calling a constructor and building up the Setter values one by one) is very rare. Styles are used for templates, and templates should be available at XAML load time, so any Style created in code is usually available too late to be applied to controls in a UI.


Style() Style() Style() Style()

Initializes a new instance of the Style class, with no initial TargetType and an empty Setters collection.

public : Style()
Style() const;
public Style()
Public Sub New()
See Also

Style(TypeName) Style(TypeName) Style(TypeName) Style(TypeName)

Initializes a new instance of the Style class, with a specified initial TargetType and an empty Setters collection.

public : Style(TypeName targetType)
Style(TypeName targetType) const;
public Style(Type targetType)
Public Sub New(targetType As Type)
Type Type

The TargetType to set for the Style.



If you are programming using a .NET language (C# or Visual Basic), the TypeName type projects as System.Type. This is not correctly indicated in the C# and Visual Basic syntaxes above; the targetType parameter should take a System.Type. When programming using C#, it is common to use the typeof operator to get references to the System.Type of a type. In Visual Basic, use GetType.


BasedOn BasedOn BasedOn BasedOn

Gets or sets a defined style that is the basis of the current style.

public : Style BasedOn { get; set; }
Style BasedOn(); void BasedOn(Style basedon);
public Style BasedOn { get; set; }
Public ReadWrite Property BasedOn As Style
<Style BasedOn="styleReference" .../>
Style Style Style Style

A defined style that is the basis of the current style. The default value is null.

Dispatcher Dispatcher Dispatcher Dispatcher

Gets the CoreDispatcher that this object is associated with. The CoreDispatcher represents a facility that can access the DependencyObject on the UI thread even if the code is initiated by a non-UI thread.

(Inherited from DependencyObject)

IsSealed IsSealed IsSealed IsSealed

Gets a value that indicates whether the style is read-only and cannot be changed.

public : Platform::Boolean IsSealed { get; }
bool IsSealed();
public bool IsSealed { get; }
Public ReadOnly Property IsSealed As bool
bool bool

true if the style is read-only; otherwise, false.

Setters Setters Setters Setters

Gets a collection of Setter objects.

public : SetterBaseCollection Setters { get; }
SetterBaseCollection Setters();
public SetterBaseCollection Setters { get; }
Public ReadOnly Property Setters As SetterBaseCollection
<Style ...>
SetterBaseCollection SetterBaseCollection

A collection of Setter objects. The default is an empty collection.

TargetType TargetType TargetType TargetType

Gets or sets the type for which the style is intended. TargetType can be used to declare an implicit style resource if there's no resource key specified.

public : TypeName TargetType { get; set; }
TypeName TargetType(); void TargetType(TypeName targettype);
public Type TargetType { get; set; }
Public ReadWrite Property TargetType As Type
<Style TargetType="typeName"/>
Type Type

The type of object to which the style is applied. This value is usually set in XAML, not code. See Remarks.


This example creates two styles: one for a TextBlock and one for a TextBox. Each style is applied to two instances of a control to create a uniform appearance for each TextBlock and TextBox. The example sets the FrameworkElement.Style property of each control by referencing the Style as a {StaticResource} markup extension.

<ControlTemplate TargetType="Button">
  <Grid >
      <VisualStateGroup x:Name="CommonStates">


          <!--Take one half second to transition to the PointerOver state.-->
          <VisualTransition To="PointerOver" 
        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, ButtonBrush, to red when the
            Pointer is over the button.-->
        <VisualState x:Name="PointerOver">
            <ColorAnimation Storyboard.TargetName="ButtonBrush" 
                            Storyboard.TargetProperty="Color" To="Red" />
      <SolidColorBrush x:Name="ButtonBrush" Color="Green"/>


A TargetType value is required for all cases where you use or declare a Style. There is no default value. Even a Style that is used as an inline value of the FrameworkElement.Style property requires an explicit TargetType value.

The typical way to specify a TargetType value is through a XAML attribute on the Style element. When set in XAML, the meaning of TargetType and the values you provide take on some aspects of how types are represented in XAML.

For XAML, any prefixes that would be necessary to refer to a type through a XAML element usage should be included in the TargetType attribute value. For example, if a style targets a custom type, which is defined in a code namespace that's mapped to the "local:" prefix, then the TargetType attribute value for that type's style should include that same prefix preceding the type name. This behavior is enabled by built-in string-type conversion behavior in the Windows Runtime XAML parser.

When defining styles for custom types, once you've included a mapping prefix for a TargetType you don't include any prefix in the Property value of any Setter within that Style.

The value you provide for TargetType modifies the lookup behavior for any Setter.Property value you specify within the style. Specifically, the dependency properties that you reference by name for a Setter.Property XAML attribute value are expected to exist on the TargetType type, or on any ancestor class. For example, if the TargetType you specify is Button, and one of the Setter.Property XAML attribute values in the Style is "Background", that resolves to the Control.Background property (Control is three levels above Button in its class inheritance, and Button inherits all properties of Control ). It's typical to specify the TargetType value to be the same UI element names you'd use in typical UI markup, you wouldn't usually name an ancestor class (although that's technically allowed).

If the Style includes a Setter that declares a control template (a value for the Template property), then the TargetType value of the parent Style should match the TargetType value of the contained ControlTemplate element.

Implicit styles

Styles are almost always declared as XAML resources that are shared and applied to each UI element in the app that references that style. In order to be declared as a resource, all XAML elements including the Style elements must have a key within the resources collection that distinguishes each resource for lookup at run-time. The Style element (and also the various template elements such as ControlTemplate ) support a feature called implicit styles. For an implicit style, the value you provide for the TargetType value also serves as the key for that style in its resources collection scope, and you aren't required to specify the x:Key attribute value. (In contrast, most other elements you declare within a resources collection do need an explicit x:Key attribute value and you'd get design-time or parser errors that enforce this.)

A style that's declared using the implicit style then is used as the Style value for any UI element instance that specifically is of the type that matches the TargetType of the implicit style. Controls don't need to reference a style with a Style attribute value and a {StaticResource} markup extension reference to a key to get this behavior, it's implicit behavior if those controls match an existing implicit style's type.

Implicit styles don't apply to elements that are subtypes of the type referenced as the TargetType value. For example, if you declare an implicit style for ToggleButton controls, and your app has CheckBox controls (CheckBox derives from ToggleButton ), the style applies specifically to ToggleButton controls but not to CheckBox controls.

The Windows Runtime defines default implicit styles for every practical UI element that's part of the Windows Runtime API. It has to do this because these styles define the visuals for elements (particularly the templates), and an element with no visuals won't even appear in the UI or participate in layout. All of these implicit styles can be seen in the design-helper XAML file called generic.xaml. The tools you use to edit XAML can copy discrete parts of this file into your app's XAML as the starting point when you edit copies of styles as enabled by the tools. Within the default implicit styles, there are many layers of resource reference, as well as theme support using the {ThemeResource} markup extension and theme-specific brushes or other resources. You can override any implicit style that would otherwise come from the Windows Runtime defines default implicit styles. For more info, see Quickstart: Styling controls and Quickstart: Control templates.

Using TargetType in code

Setting TargetType in code is uncommon. The XAML style system is intended to be used by loading XAML as a resource and having all aspects of a style be ready beforehand. There should be very few scenarios where you would not know info about how to style a control or apply a style until runtime, where there'd be a need to set a TargetType on a Style created or referenced in code.

Getting a TargetType in code is also uncommon, but there are perhaps a few more scenarios where you might be doing this. For example, there might be a set of named Style resources already defined in your XAML. But you might want to double-check that a style you're about to apply to a control has a TargetType value that works for the type of the control you're applying it to. So, you might have code like this:

        private bool VerifyStyle(FrameworkElement scope, String styleKey, Control applyTo)
            Style styleToCheck = scope.Resources[styleKey] as Style;
            if (styleToCheck != null)
                if (styleToCheck.TargetType == applyTo.GetType())
                    // applyTo.Style = styleToCheck;
                    return true;
            return false;


If you are programming using a Microsoft .NET language (C# or Microsoft Visual Basic), the TypeName type projects as System.Type. When programming using C#C#, you usually use the typeof operator to get references to the System.Type of a type based on a type name as a string. In Microsoft Visual Basic, use GetType.

Migration notes

  • If you have used XAML for Windows Presentation Foundation (WPF), then you might have used an x:Type markup extension to fill in any XAML values that take a System.Type. The Windows Runtime XAML parser does not support x:Type. Instead, you should refer to the type by name without using any markup extension, and any necessary XAML-to-backing type conversion is already handled by the built-in conversion behavior in the XAML parser.


ClearValue(DependencyProperty) ClearValue(DependencyProperty) ClearValue(DependencyProperty) ClearValue(DependencyProperty)

Clears the local value of a dependency property.

(Inherited from DependencyObject)

GetAnimationBaseValue(DependencyProperty) GetAnimationBaseValue(DependencyProperty) GetAnimationBaseValue(DependencyProperty) GetAnimationBaseValue(DependencyProperty)

Returns any base value established for a dependency property, which would apply in cases where an animation is not active.

(Inherited from DependencyObject)

GetValue(DependencyProperty) GetValue(DependencyProperty) GetValue(DependencyProperty) GetValue(DependencyProperty)

Returns the current effective value of a dependency property from a DependencyObject.

(Inherited from DependencyObject)

ReadLocalValue(DependencyProperty) ReadLocalValue(DependencyProperty) ReadLocalValue(DependencyProperty) ReadLocalValue(DependencyProperty)

Returns the local value of a dependency property, if a local value is set.

(Inherited from DependencyObject)

RegisterPropertyChangedCallback(DependencyProperty,DependencyPropertyChangedCallback) RegisterPropertyChangedCallback(DependencyProperty,DependencyPropertyChangedCallback) RegisterPropertyChangedCallback(DependencyProperty,DependencyPropertyChangedCallback) RegisterPropertyChangedCallback(DependencyProperty,DependencyPropertyChangedCallback)

Registers a notification function for listening to changes to a specific DependencyProperty on this DependencyObject instance.

(Inherited from DependencyObject)

Seal() Seal() Seal() Seal()

Locks the style so that the TargetType property or any Setter in the Setters collection cannot be changed.

public : void Seal()
void Seal() const;
public void Seal()
Public Function Seal() As void

SetValue(DependencyProperty,Object) SetValue(DependencyProperty,Object) SetValue(DependencyProperty,Object) SetValue(DependencyProperty,Object)

Sets the local value of a dependency property on a DependencyObject.

(Inherited from DependencyObject)

UnregisterPropertyChangedCallback(DependencyProperty,Int64) UnregisterPropertyChangedCallback(DependencyProperty,Int64) UnregisterPropertyChangedCallback(DependencyProperty,Int64) UnregisterPropertyChangedCallback(DependencyProperty,Int64)

Cancels a change notification that was previously registered by calling RegisterPropertyChangedCallback.

(Inherited from DependencyObject)

See Also