Export as XAML WPF drawing brush and resource dictionary

You can save Microsoft Expression Design artwork as a drawing brush resource in a XAML Windows Presentation Foundation (WPF) resource dictionary that you can import into a Microsoft Expression Blend project. You can use a drawing brush resource in an Expression Blend project to paint any object. For example, you could create artwork for the appearance of a button in Expression Design, and then export the artwork as a brush resource in a resource dictionary that you can import into Expression Blend. For more information about importing resource dictionaries into Expression Blend, see the Expression Blend User Guide.

Additionally, you can export one or many slices of your artwork as individual XAML brush resources in a XAML WPF resource dictionary.

Resource dictionaries are useful because they can contain all the resources that make up the unique look of your application in one file. You can add a resource dictionary to any WPF project in Expression Blend, and then apply the brush resources in the resource dictionary to the brush properties of any object in the project.


Colors in your exported XAML code are based on RGB and are not color-managed. If you use a custom color monitor profile, the colors you see in Expression Design may differ from those displayed in your final XAML-editing software.

To export art as brush resources in a XAML WPF resource dictionary

  1. On the File menu, click Export. The Export dialog box displays your artwork in a preview window.

  2. Under Items to Export, select one of the following options:

    • Whole document   Select this option to automatically export all the artwork in your Expression Design document as brush resources in a resource dictionary.

    • Selected objects   Select this option to export only those objects that you selected before you opened the Export dialog box.

    • Slices   Select this option to export slices of your artwork, in multiple output files and formats. Slices are configured before you open the Export dialog box. The preview window changes to display each slice individually so that you can select different export settings for each. You can also use the Slice contents drop-down box to show or hide objects in the slice. For more information, see Working with slices.

  3. In the Export dialog box, in the Format list, select one of the following:

    • XAML WPF Resource Dictionary   Select this option if you are exporting the whole document or selected objects. You can then set the Group by property to export one resource per layer (Layers), one resource per top-level object (Objects), or one resource for the whole document or selected objects (Document). For example, if each layer in your document represents a button in a future Expression Blend project, select Layers.

    • XAML WPF Drawing Brush   If you are exporting slices, select this option for each slice. You can set the Format property for multiple slices by using the SHIFT key to select multiple slices before you set the Format property.


      Expression Design does not assume that you want to create a drawing brush resource for each slice. For example, you could export a slice in PNG format, and export the PNG file in a XAML WPF resource dictionary container. The PNG file is exported in a subfolder in the same directory as your exported resource dictionary file, and the PNG file is referenced as an image brush resource instead of as a drawing brush resource. You can use image brush resources to paint objects in an Expression Blend project just like drawing brush resources.

      You can then select the XAML WPF Resource Dictionary container from the list next to Container name, and type a name for your resource dictionary in the Container name text box. If you do not select a container, each slice will be exported as a brush resource in its own individual resource dictionary.

  4. Adjust the following settings for brush resources under Live effects:

    • Rasterize all   Select this option to rasterize (convert into bitmapped images) any live effects that are applied to your artwork. This option helps maintain the appearance of your artwork as much as possible.

    • Convert to XAML effects   Select this option to convert any live effects to XAML-supported effects. Live effects that are not supported in XAML are rasterized.


    If you are exporting slices as brush resources, you must set these properties for each slice.

  5. Next to File name, type a name for your resource dictionary.


    The File name field is not present if you are exporting slices because the names of the slices are used as the file names for the exported brush resources.

  6. Next to Location, browse to or type the path of the location where you want the output file to be saved.

  7. Click Export All to export the file or files. If you are exporting slices and you want to export only some of them, you can select multiple slices in the preview window (by holding down the SHIFT key), click the drop-down arrow next to Export All, and then click Export Selected Slice(s). Alternatively, if you want to save any changes that you made to the export properties for individual slices without actually exporting the slices, click the drop-down arrow next to Export All and select Save Settings and Close.

    Your resource dictionary is exported to the path that you specified in the Location property, together with any supporting artwork, in a subfolder named <resource_name>_files. When you add the resource dictionary to a Expression Blend project, Expression Blend automatically imports the <resource_name>_files folder also.

See also

Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.

Community Additions