Share via

The tile template catalog (Windows Runtime apps)

  • Article

This topic lists the tile templates available for use in a tile notification, with pictorial examples of each for both Windows and Windows Phone 8.1. Select a template name from the list to be shown its details, such as sample XML content, versioned names, and image sizes.

Note  When displayed on Windows Phone 8.1, certain template types do not act as they do when displayed on Windows. Peek templates on the phone flip from front to back rather than scrolling up and down and image collection tiles have an animated checkerboard pattern.

TileSquare150x150Image

TileSquare150x150Block

TileSquare150x150Text01

TileSquare150x150Text02

TileSquare150x150Text03

TileSquare150x150Text04

TileSquare150x150PeekImageAndText01

TileSquare150x150PeekImageAndText02

TileSquare150x150PeekImageAndText03

TileSquare150x150PeekImageAndText04

TileWide310x150Image

TileWide310x150ImageCollection

TileWide310x150ImageAndText01

TileWide310x150ImageAndText02

TileWide310x150BlockAndText01

TileWide310x150BlockAndText02

TileWide310x150PeekImageCollection01

TileWide310x150PeekImageCollection02

TileWide310x150PeekImageCollection03

TileWide310x150PeekImageCollection04

TileWide310x150PeekImageCollection05

TileWide310x150PeekImageCollection06

TileWide310x150PeekImageAndText01

TileWide310x150PeekImageAndText02

TileWide310x150PeekImage01

TileWide310x150PeekImage02

TileWide310x150PeekImage03

TileWide310x150PeekImage04

TileWide310x150PeekImage05

TileWide310x150PeekImage06

TileWide310x150SmallImageAndText01

TileWide310x150SmallImageAndText02

TileWide310x150SmallImageAndText03

TileWide310x150SmallImageAndText04

TileWide310x150SmallImageAndText05

TileWide310x150Text01

TileWide310x150Text02

TileWide310x150Text03

TileWide310x150Text04

TileWide310x150Text05

TileWide310x150Text06

TileWide310x150Text07

TileWide310x150Text08

TileWide310x150Text09

TileWide310x150Text10

TileWide310x150Text11

TileSquare310x310BlockAndText01

TileSquare310x310BlockAndText02

TileSquare310x310Image

TileSquare310x310ImageAndText01

TileSquare310x310ImageAndText02

TileSquare310x310ImageAndTextOverlay01

TileSquare310x310ImageAndTextOverlay02

TileSquare310x310ImageAndTextOverlay03

TileSquare310x310ImageCollectionAndText01

TileSquare310x310ImageCollectionAndText02

TileSquare310x310ImageCollection

TileSquare310x310SmallImagesAndTextList01

TileSquare310x310SmallImagesAndTextList02

TileSquare310x310SmallImagesAndTextList03

TileSquare310x310SmallImagesAndTextList04

TileSquare310x310SmallImagesAndTextList05

TileSquare310x310SmallImageAndText01

TileSquare310x310Text01

TileSquare310x310Text02

TileSquare310x310Text03

TileSquare310x310Text04

TileSquare310x310Text05

TileSquare310x310Text06

TileSquare310x310Text07

TileSquare310x310Text08

TileSquare310x310Text09

TileSquare310x310TextList01

TileSquare310x310TextList02

TileSquare310x310TextList03

TileSquare71x71Image

TileSquare71x71IconWithBadge

TileSquare150x150IconWithBadge

TileWide310x150IconWithBadgeAndText

 

Medium tiles

Medium tiles are square and contain either only an image or only text. Medium peek tiles enable you to combine images and text in an animated tile.

  • Medium text-only templates
  • Medium image-only templates
  • Medium peek templates

Medium text-only templates

  • TileSquareBlock/TileSquare150x150Block
  • TileSquareText01/TileSquare150x150Text01
  • TileSquareText02/TileSquare150x150Text02
  • TileSquareText03/TileSquare150x150Text03
  • TileSquareText04/TileSquare150x150Text04

TileSquareBlock/TileSquare150x150Block

Windows: One string of large block text (generally numerical) over a single, short line of regular text.

Windows Phone 8.1: One short string of large block text (generally numerical) in the lower right corner, to the left of a single, very short line of regular text.

Version 1 name TileSquareBlock
Version 2 and 3 name TileSquare150x150Block
Example

Example XML 
<tile>
  <visual>
    <binding template="TileSquareBlock">
      <text id="1">Text Field 1 (block text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Block" fallback="TileSquareBlock">
      <text id="1">Text Field 1 (block text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquareText01/TileSquare150x150Text01

One header string in larger text on the first line; three strings of regular text on each of the next three lines. Text does not wrap.

Version 1 name TileSquareText01
Version 2 and 3 name TileSquare150x150Text01
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquareText01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Text01" fallback="TileSquareText01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>

 

TileSquareText02/TileSquare150x150Text02

One header string in larger text on the first line, over one string of regular text wrapped over a maximum of three lines.

Version 1 name TileSquareText02
Version 2 and 3 name TileSquare150x150Text02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquareText02">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Text02" fallback="TileSquareText02">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquareText03/TileSquare150x150Text03

Four strings of regular text on four lines. Text does not wrap.

Version 1 name TileSquareText03
Version 2 and 3 name TileSquare150x150Text03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquareText03">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Text03" fallback="TileSquareText03">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>

 

TileSquareText04/TileSquare150x150Text04

One string of regular text wrapped over a maximum of four lines.

Version 1 name TileSquareText04
Version 2 and 3 name TileSquare150x150Text04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquareText04">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Text04" fallback="TileSquareText04">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Medium image-only templates

TileSquareImage/TileSquare150x150Image

One square image that fills the entire tile, no text.

Version 1 name TileSquareImage
Version 2 and 3 name TileSquare150x150Image
Example

Example XML 
<tile>
  <visual>
    <binding template="TileSquareImage">
      <image id="1" src="image1" alt="alt text"/>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150Image" fallback="TileSquareImage">
      <image id="1" src="image1" alt="alt text"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 120x120 150x150 210x210 270x270

 

Medium peek templates

Note  Peek templates on the phone flip between the two sections rather than scrolling up and down between them.

  • TileSquarePeekImageAndText01/TileSquare150x150PeekImageAndText01
  • TileSquarePeekImageAndText02/TileSquare150x150PeekImageAndText02
  • TileSquarePeekImageAndText03/TileSquare150x150PeekImageAndText03
  • TileSquarePeekImageAndText04/TileSquare150x150PeekImageAndText04

TileSquarePeekImageAndText01/TileSquare150x150PeekImageAndText01

Top/Front: One square image, no text. Bottom/Back: One header string in larger text on the first line, three strings of regular text on each of the next three lines. Text does not wrap.

Version 1 name TileSquarePeekImageAndText01
Version 2 and 3 name TileSquare150x150PeekImageAndText01
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquarePeekImageAndText01">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150PeekImageAndText01" fallback="TileSquarePeekImageAndText01">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 120x120 150x150 210x210 270x270

 

TileSquarePeekImageAndText02/TileSquare150x150PeekImageAndText02

Top/Front: Square image, no text. Bottom/Back: One header string in larger text on the first line, over one string of regular text wrapped over a maximum of three lines.

Version 1 name TileSquarePeekImageAndText02
Version 2 and 3 name TileSquare150x150PeekImageAndText02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquarePeekImageAndText02">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150PeekImageAndText02" fallback="TileSquarePeekImageAndText02">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 120x120 150x150 210x210 270x270

 

TileSquarePeekImageAndText03/TileSquare150x150PeekImageAndText03

Top/Front: Square image, no text. Bottom/Back: Four strings of regular text on four lines. Text does not wrap.

Version 1 name TileSquarePeekImageAndText03
Version 2 and 3 name TileSquare150x150PeekImageAndText03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquarePeekImageAndText03">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150PeekImageAndText03" fallback="TileSquarePeekImageAndText03">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 120x120 150x150 210x210 270x270

 

TileSquarePeekImageAndText04/TileSquare150x150PeekImageAndText04

Top/Front: Square image, no text. Bottom/Back: One string of regular text wrapped over a maximum of four lines.

Version 1 name TileSquarePeekImageAndText04
Version 2 and 3 name TileSquare150x150PeekImageAndText04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileSquarePeekImageAndText04">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileSquare150x150PeekImageAndText04" fallback="TileSquarePeekImageAndText04">
      <image id="1" src="image1" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 120x120 150x150 210x210 270x270

 

Wide tiles

  • Wide text-only templates
  • Wide image-only templates
  • Wide image-and-text templates
  • Wide peek templates

Wide text-only templates

  • TileWideText01/TileWide310x150Text01
  • TileWideText02/TileWide310x150Text02
  • TileWideText03/TileWide310x150Text03
  • TileWideText04/TileWide310x150Text04
  • TileWideText05/TileWide310x150Text05
  • TileWideText06/TileWide310x150Text06
  • TileWideText07/TileWide310x150Text07
  • TileWideText08/TileWide310x150Text08
  • TileWideText09/TileWide310x150Text09
  • TileWideText10/TileWide310x150Text10
  • TileWideText11/TileWide310x150Text11
  • TileWideBlockAndText01/TileWide310x150BlockAndText01
  • TileWideBlockAndText02/TileWide310x150BlockAndText02

TileWideText01/TileWide310x150Text01

One header string in larger text on the first line, four strings of regular text on the next four lines. Text does not wrap.

Version 1 name TileWideText01
Version 2 and 3 name TileWide310x150Text01
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text01" fallback="TileWideText01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

TileWideText02/TileWide310x150Text02

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eight short strings arranged in two columns of four lines each. Columns are of equal width.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText02
Version 2 and 3 name TileWide310x150Text02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText02">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text02" fallback="TileWideText02">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText03/TileWide310x150Text03

One string of large text wrapped over a maximum of three lines.

Version 1 name TileWideText03
Version 2 and 3 name TileWide310x150Text03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText03">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text03" fallback="TileWideText03">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

TileWideText04/TileWide310x150Text04

One string of regular text wrapped over a maximum of five lines.

Version 1 name TileWideText04
Version 2 and 3 name TileWide310x150Text04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText04">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text04" fallback="TileWideText04">
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

TileWideText05/TileWide310x150Text05

Five strings of regular text on five lines. Text does not wrap.

Version 1 name TileWideText05
Version 2 and 3 name TileWide310x150Text05
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText05">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text05" fallback="TileWideText05">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

TileWideText06/TileWide310x150Text06

Note  Windows only; not supported on Windows Phone 8.1

Ten short strings of regular text, arranged in two columns of five lines each. Columns are of equal width.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText06
Version 2 and 3 name TileWide310x150Text06
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText06">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text06" fallback="TileWideText06">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText07/TileWide310x150Text07

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eight short strings of regular text arranged in two columns of four lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileWideText10, but the first column is wider.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText07
Version 2 and 3 name TileWide310x150Text07
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText07">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text07" fallback="TileWideText07">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText08/TileWide310x150Text08

Note  Windows only; not supported on Windows Phone 8.1

Ten short strings of regular text arranged in two columns of five lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileWideText11, but the first column is wider.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText08
Version 2 and 3 name TileWide310x150Text08
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText08">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text08" fallback="TileWideText08">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText09/TileWide310x150Text09

One header string in larger text over one string of regular text wrapped over a maximum of four lines.

Version 1 name TileWideText09
Version 2 and 3 name TileWide310x150Text09
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText09">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text09" fallback="TileWideText09">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText10/TileWide310x150Text10

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eight short strings of regular text arranged in two columns of four lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileWideText07, but the first column is narrower.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText10
Version 2 and 3 name TileWide310x150Text10
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText10">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text10" fallback="TileWideText10">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideText11/TileWide310x150Text11

Note  Windows only; not supported on Windows Phone 8.1

Ten short strings of regular text arranged in two columns of five lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileWideText08, but the first column is narrower.

Important  If this template is sent to Windows Phone 8.1, it causes the tile to revert to its default image.

 

Version 1 name TileWideText11
Version 2 and 3 name TileWide310x150Text11
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideText11">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Text11" fallback="TileWideText11">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileWideBlockAndText01/TileWide310x150BlockAndText01

Four strings of regular, unwrapped text on the left; large block text (this should be numerical) over a single, short string of regular text on the right.

Important  The last of the four strings on the left is ignored in Windows Phone 8.1.

 

Version 1 name TileWideBlockAndText01
Version 2 and 3 name TileWide310x150BlockAndText01
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideBlockAndText01">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5 (block text)</text>
      <text id="6">Text Field 6 (under block text)</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150BlockAndText01" fallback="TileWideBlockAndText01">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5 (block text)</text>
      <text id="6">Text Field 6 (under block text)</text>
    </binding>  
  </visual>
</tile>

 

TileWideBlockAndText02/TileWide310x150BlockAndText02

One string of regular text wrapped over a maximum of four lines on the left; large block text (this should be numerical) over a single, short string of regular text on the right.

Version 1 name TileWideBlockAndText02
Version 2 and 3 name TileWide310x150BlockAndText02
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideBlockAndText02">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2 (block text)</text>
      <text id="3">Text Field 3 (under block text)</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150BlockAndText02" fallback="TileWideBlockAndText02">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2 (block text)</text>
      <text id="3">Text Field 3 (under block text)</text>
    </binding>  
  </visual>
</tile>

 

Wide image-only templates

  • TileWideImage/TileWide310x150Image
  • TileWideImageCollection/TileWide310x150ImageCollection

TileWideImage/TileWide310x150Image

One wide image that fills the entire tile, no text.

Version 1 name TileWideImage
Version 2 and 3 name TileWide310x150Image
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideImage">
      <image id="1" src="image1.png" alt="alt text"/>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150Image" fallback="TileWideImage">
      <image id="1" src="image1.png" alt="alt text"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270

 

TileWideImageCollection/TileWide310x150ImageCollection

Windows: One large square image with four smaller square images to its right, no text.

Windows Phone 8.1: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.

Version 1 name TileWideImageCollection
Version 2 and 3 name TileWide310x150ImageCollection
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideImageCollection">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150ImageCollection" fallback="TileWideImageCollection">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135

 

Wide image-and-text templates

  • TileWideImageAndText01/TileWide310x150ImageAndText01
  • TileWideImageAndText02/TileWide310x150ImageAndText02
  • TileWideSmallImageAndText01/TileWide310x150SmallImageAndText01
  • TileWideSmallImageAndText02/TileWide310x150SmallImageAndText02
  • TileWideSmallImageAndText03/TileWide310x150SmallImageAndText03
  • TileWideSmallImageAndText04/TileWide310x150SmallImageAndText04
  • TileWideSmallImageAndText05/TileWide310x150SmallImageAndText05

TileWideImageAndText01/TileWide310x150ImageAndText01

One wide image over one string of regular text wrapped over a maximum of two lines (one line on Windows Phone). The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo" on Windows or "none" on Windows Phone 8.1.

 

Version 1 name TileWideImageAndText01
Version 2 and 3 name TileWide310x150ImageAndText01
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150ImageAndText01" fallback="TileWideImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x80 310x100 434x140 558x180

 

TileWideImageAndText02/TileWide310x150ImageAndText02

Windows: One wide image over two strings of regular text on two lines. Text does not wrap. The width of the text area depends on whether a logo is displayed.

Windows Phone 8.1: One wide image over one string of regular text on one line. Text does not wrap. The second string is ignored. The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo" on Windows or "none" on Windows Phone 8.1.

 

Version 1 name TileWideImageAndText02
Version 2 and 3 name TileWide310x150ImageAndText02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150ImageAndText02" fallback="TileWideImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x80 310x100 434x140 558x180

 

TileWideSmallImageAndText01/TileWide310x150SmallImageAndText01

On the left, one small image; on the right, one string of large text wrapped over a maximum of three lines.

Important  On Windows Phone 8.1, the image is not shown.

 

Version 1 name TileWideSmallImageAndText01
Version 2 and 3 name TileWide310x150SmallImageAndText01
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWideSmallImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150SmallImageAndText01" fallback="TileWideSmallImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 64x64 80x80 112x112 144x144

 

TileWideSmallImageAndText02/TileWide310x150SmallImageAndText02

On the left, one small image; on the right, one header string in larger text on the first line over four strings of regular text on the next four lines. Text does not wrap.

Important  On Windows Phone 8.1, the image is not shown.

 

Version 1 name TileWideSmallImageAndText02
Version 2 and 3 name TileWide310x150SmallImageAndText02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideSmallImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150SmallImageAndText02" fallback="TileWideSmallImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 64x64 80x80 112x112 144x144

 

TileWideSmallImageAndText03/TileWide310x150SmallImageAndText03

On the left, one small image; on the right, one string of regular text wrapped over a maximum of five lines.

Important  On Windows Phone 8.1, the image is not shown.

 

Version 1 name TileWideSmallImageAndText03
Version 2 and 3 name TileWide310x150SmallImageAndText03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideSmallImageAndText03">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150SmallImageAndText03" fallback="TileWideSmallImageAndText03">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 64x64 80x80 112x112 144x144

 

TileWideSmallImageAndText04/TileWide310x150SmallImageAndText04

On the left, one small image; on the right, one header string of larger text on the first line over one string of regular text wrapped over a maximum of four lines.

Important  On Windows Phone 8.1, the image is not shown.

 

Version 1 name TileWideSmallImageAndText04
Version 2 and 3 name TileWide310x150SmallImageAndText04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideSmallImageAndText04">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150SmallImageAndText04" fallback="TileWideSmallImageAndText04">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 64x64 80x80 112x112 144x144

 

TileWideSmallImageAndText05/TileWide310x150SmallImageAndText05

On the left, one header string in larger text over one string of regular text wrapped over a maximum of four lines; on the right, one small rectangular (3x4) image. Images wider than the image area will be cropped.

Important  On Windows Phone 8.1, the image is not shown.

 

Version 1 name TileWideSmallImageAndText05
Version 2 and 3 name TileWide310x150SmallImageAndText05
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWideSmallImageAndText05">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150SmallImageAndText05" fallback="TileWideSmallImageAndText05">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 36x52 45x65 63x91 81x117

 

Wide peek templates

Note  Peek templates on the phone flip between the two section rather than scrolling up and down between them.

  • TileWidePeekImageCollection01/TileWide310x150PeekImageCollection01
  • TileWidePeekImageCollection02/TileWide310x150PeekImageCollection02
  • TileWidePeekImageCollection03/TileWide310x150PeekImageCollection03
  • TileWidePeekImageCollection04/TileWide310x150PeekImageCollection04
  • TileWidePeekImageCollection05/TileWide310x150PeekImageCollection05
  • TileWidePeekImageCollection06/TileWide310x150PeekImageCollection06
  • TileWidePeekImageAndText01/TileWide310x150PeekImageAndText01
  • TileWidePeekImageAndText02/TileWide310x150PeekImageAndText02
  • TileWidePeekImage01/TileWide310x150PeekImage01
  • TileWidePeekImage02/TileWide310x150PeekImage02
  • TileWidePeekImage03/TileWide310x150PeekImage03
  • TileWidePeekImage04/TileWide310x150PeekImage04
  • TileWidePeekImage05/TileWide310x150PeekImage05
  • TileWidePeekImage06/TileWide310x150PeekImage06

TileWidePeekImageCollection01/TileWide310x150PeekImageCollection01

Windows: Top: One large square image with four smaller square images to its right, no text. Note that the large image is not quite square; it is slightly wider than it is tall. If you supply a square image, the image will be scaled for width and slightly cropped on the top and bottom.

Windows Phone 8.1: Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.

Bottom/Back: One header string in larger text over one string of regular text wrapped over a maximum of four lines.

Version 1 name TileWidePeekImageCollection01
Version 2 and 3 name TileWide310x150PeekImageCollection01
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection01">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection01" fallback="TileWidePeekImageCollection01">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135

 

TileWidePeekImageCollection02/TileWide310x150PeekImageCollection02

Windows: Top: One large square image with four smaller square images to its right, no text. Note that the large image is not quite square; it is slightly wider than it is tall. If you supply a square image, the image will be scaled for width and slightly cropped on the top and bottom.

Windows Phone 8.1: Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.

Bottom/Back: One header string in larger text on the first line, four strings of regular text on the next four lines. Text does not wrap.

Version 1 name TileWidePeekImageCollection02
Version 2 and 3 name TileWide310x150PeekImageCollection02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection02">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection02" fallback="TileWidePeekImageCollection02">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135

 

TileWidePeekImageCollection03/TileWide310x150PeekImageCollection03

Windows: Top: One large square image with four smaller square images to its right, no text. Note that the large image is not quite square; it is slightly wider than it is tall. If you supply a square image, the image will be scaled for width and slightly cropped on the top and bottom.

Windows Phone 8.1: Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.

Bottom/Back: One string of large text wrapped over a maximum of three lines.

Version 1 name TileWidePeekImageCollection03
Version 2 and 3 name TileWide310x150PeekImageCollection03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection03">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection03" fallback="TileWidePeekImageCollection03">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135

 

TileWidePeekImageCollection04/TileWide310x150PeekImageCollection04

Windows: Top: One large square image with four smaller square images to its right, no text. Note that the large image is not quite square; it is slightly wider than it is tall. If you supply a square image, the image will be scaled for width and slightly cropped on the top and bottom.

Windows Phone 8.1: Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.

Bottom/Back: One string of regular text wrapped over a maximum of five lines.

Version 1 name TileWidePeekImageCollection04
Version 2 and 3 name TileWide310x150PeekImageCollection04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection04">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection04" fallback="TileWidePeekImageCollection04">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135

 

TileWidePeekImageCollection05/TileWide310x150PeekImageCollection05

Windows

  • Top: One large square image with four smaller square images to its right, no text. Note that the large image is not quite square; it is slightly wider than it is tall. If you supply a square image, the image will be scaled for width and slightly cropped on the top and bottom.
  • Bottom: On the left, one small image; on the right, one header string of larger text on the first line over one string of regular text wrapped over a maximum of four lines.

Windows Phone 8.1

  • Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.
  • Back: One header string of larger text on the first line over one string of regular text wrapped over a maximum of four lines.
Version 1 name TileWidePeekImageCollection05
Version 2 and 3 name TileWide310x150PeekImageCollection05
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection05">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <image id="6" src="image6.png" alt="image next to text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection05" fallback="TileWidePeekImageCollection05">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <image id="6" src="image6.png" alt="image next to text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135
6 64x64 80x80 112x112 144x144

 

TileWidePeekImageCollection06/TileWide310x150PeekImageCollection06

Windows

  • Top: One large square image with four smaller square images to its right, no text. Bottom: On the left, one small image; on the right, one string of large text wrapped over a maximum of three lines.
  • Bottom: On the left, one small image; on the right, one string of large text wrapped over a maximum of three lines.

Windows Phone 8.1

  • Front: The images appear in a 6x3 set of tessellated, flipping blocks. An image might take up one block or four. Images are shown randomly, moving among blocks of various solid colors.
  • Back: One string of large text wrapped over a maximum of three lines.
Version 1 name TileWidePeekImageCollection06
Version 2 and 3 name TileWide310x150PeekImageCollection06
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageCollection06">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <image id="6" src="image6.png" alt="image next to text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageCollection06" fallback="TileWidePeekImageCollection06">
      <image id="1" src="image1.png" alt="larger image"/>
      <image id="2" src="image2.png" alt="small image, row 1, column 1"/>
      <image id="3" src="image3.png" alt="small image, row 1, column 2"/>
      <image id="4" src="image4.png" alt="small image, row 2, column 1"/>
      <image id="5" src="image5.png" alt="small image, row 2, column 2"/>
      <image id="6" src="image6.png" alt="image next to text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 128x120 160x150 224x210 288x270
2,3,4,5 60x60 75x75 105x105 135x135
6 64x64 80x80 112x112 144x144

 

TileWidePeekImageAndText01/TileWide310x150PeekImageAndText01

Windows: Top: One wide image, with a shorter height than a full-bleed wide image.

Windows Phone 8.1: Front: One wide image that fills the entire tile.

Bottom/Back: One string of regular text wrapped over a maximum of five lines.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Version 1 name TileWidePeekImageAndText01
Version 2 and 3 name TileWide310x150PeekImageAndText01
Example

Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageAndText01" fallback="TileWidePeekImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x80 310x100 434x140 558x180

 

TileWidePeekImageAndText02/TileWide310x150PeekImageAndText02

Top/Front: One wide image, with a shorter height than a full-bleed wide image. Bottom/Back: Five strings of regular text on five lines. Text does not wrap.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Version 1 name TileWidePeekImageAndText02
Version 2 and 3 name TileWide310x150PeekImageAndText02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImageAndText02" fallback="TileWidePeekImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x80 310x100 434x140 558x180

 

TileWidePeekImage01/TileWide310x150PeekImage01

Top/Front: One wide image. Bottom/Back: One header string in larger text over one string of regular text that wraps over a maximum of four lines.

Version 1 name TileWidePeekImage01
Version 2 and 3 name TileWide310x150PeekImage01
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage01" fallback="TileWidePeekImage01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270

 

TileWidePeekImage02/TileWide310x150PeekImage02

Top/Front: One wide image. Bottom/Back: One header string in larger text on the first line, four strings of regular text on the next four lines. Text does not wrap.

Version 1 name TileWidePeekImage02
Version 2 and 3 name TileWide310x150PeekImage02
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage02" fallback="TileWidePeekImage02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270

 

TileWidePeekImage03/TileWide310x150PeekImage03

Top/Front: One wide image. Bottom/Back: One string of large text wrapped over a maximum of three lines.

Version 1 name TileWidePeekImage03
Version 2 and 3 name TileWide310x150PeekImage03
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage03">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage03" fallback="TileWidePeekImage03">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270

 

TileWidePeekImage04/TileWide310x150PeekImage04

Top/Front: One wide image. Bottom/Back: One string of regular text wrapped over a maximum of five lines.

Version 1 name TileWidePeekImage04
Version 2 and 3 name TileWide310x150PeekImage04
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage04">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage04" fallback="TileWidePeekImage04">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270

 

TileWidePeekImage05/TileWide310x150PeekImage05

Top/Front: One wide image.

Windows: Bottom: On the left, one small image; on the right, one header string of larger text on the first line over one string of regular text wrapped over a maximum of four lines.

Windows Phone 8.1: Back: One header string of larger text on the first line over one string of regular text wrapped over a maximum of four lines.

Version 1 name TileWidePeekImage05
Version 2 and 3 name TileWide310x150PeekImage05
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage05">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="smaller image next to text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage05" fallback="TileWidePeekImage05">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="smaller image next to text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270
2 64x64 80x80 112x112 144x144

 

TileWidePeekImage06/TileWide310x150PeekImage06

Top/Front: One wide image.

Windows: Bottom: On the left, one small image; on the right, one string of large text wrapped over a maximum of three lines.

Windows Phone 8.1: Back: One string of large text wrapped over a maximum of three lines.

Important  On Windows Phone 8.1, the small image that accompanies the text is not shown.

 

Version 1 name TileWidePeekImage06
Version 2 and 3 name TileWide310x150PeekImage06
Example
Example XML 
<tile>
  <visual>
    <binding template="TileWidePeekImage06">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="smaller image next to text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>
<tile>
  <visual version="2">
    <binding template="TileWide310x150PeekImage06" fallback="TileWidePeekImage06">
     <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="smaller image next to text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x120 310x150 434x210 558x270
2 64x64 80x80 112x112 144x144

 

Large tiles

  • Large text-only templates
  • Large image-only templates
  • Large image-and-text templates

Large text-only templates

  • TileSquare310x310Text01
  • TileSquare310x310Text02
  • TileSquare310x310Text03
  • TileSquare310x310Text04
  • TileSquare310x310Text05
  • TileSquare310x310Text06
  • TileSquare310x310Text07
  • TileSquare310x310Text08
  • TileSquare310x310Text09
  • TileSquare310x310TextList01
  • TileSquare310x310TextList02
  • TileSquare310x310TextList03
  • TileSquare310x310BlockAndText01

TileSquare310x310Text01

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text on the first line, nine strings of regular text on the next nine lines. Text does not wrap.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7</text>
      <text id="8">Text Field 8</text>
      <text id="9">Text Field 9</text>
      <text id="10">Text Field 10</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text02

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eighteen short strings arranged in two columns of nine lines each. Columns are of equal width. This template is similar to TileSquare310x310Text05 and TileSquare310x310Text07, but those templates use columns of unequal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text02">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
      <text id="10">Text Field 10, row 5, column 1</text>
      <text id="11">Text Field 11, row 5, column 2</text>
      <text id="12">Text Field 12, row 6, column 1</text>
      <text id="13">Text Field 13, row 6, column 2</text>
      <text id="14">Text Field 14, row 7, column 1</text>
      <text id="15">Text Field 15, row 7, column 2</text>
      <text id="16">Text Field 16, row 8, column 1</text>
      <text id="17">Text Field 17, row 8, column 2</text>
      <text id="18">Text Field 18, row 9, column 1</text>
      <text id="19">Text Field 19, row 9, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text03

Note  Windows only; not supported on Windows Phone 8.1

Eleven strings of regular text on eleven lines. Text does not wrap.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text03
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text03">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7</text>
      <text id="8">Text Field 8</text>
      <text id="9">Text Field 9</text>
      <text id="10">Text Field 10</text>
      <text id="11">Text Field 11</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text04

Note  Windows only; not supported on Windows Phone 8.1

Twenty-two short strings of regular text, arranged in two columns of eleven lines each. Columns are of equal width. This template is similar to TileSquare310x310Text06 and TileSquare310x310Text08, but those templates use columns of unequal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text04
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text04">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
      <text id="11">Text Field 11, row 6, column 1</text>
      <text id="12">Text Field 12, row 6, column 2</text>
      <text id="13">Text Field 13, row 7, column 1</text>
      <text id="14">Text Field 14, row 7, column 2</text>
      <text id="15">Text Field 15, row 8, column 1</text>
      <text id="16">Text Field 16, row 8, column 2</text>
      <text id="17">Text Field 17, row 9, column 1</text>
      <text id="18">Text Field 18, row 9, column 2</text>
      <text id="19">Text Field 19, row 10, column 1</text>
      <text id="20">Text Field 20, row 10, column 2</text>
      <text id="21">Text Field 21, row 11, column 1</text>
      <text id="22">Text Field 22, row 11, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text05

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eighteen short strings of regular text arranged in two columns of nine lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileSquare310x310Text07, which has an even narrower first column, and TileSquare310x310Text02, which has columns of equal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text05
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text05">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
      <text id="10">Text Field 10, row 5, column 1</text>
      <text id="11">Text Field 11, row 5, column 2</text>
      <text id="12">Text Field 12, row 6, column 1</text>
      <text id="13">Text Field 13, row 6, column 2</text>
      <text id="14">Text Field 14, row 7, column 1</text>
      <text id="15">Text Field 15, row 7, column 2</text>
      <text id="16">Text Field 16, row 8, column 1</text>
      <text id="17">Text Field 17, row 8, column 2</text>
      <text id="18">Text Field 18, row 9, column 1</text>
      <text id="19">Text Field 19, row 9, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text06

Note  Windows only; not supported on Windows Phone 8.1

Twenty-two short strings of regular text arranged in two columns of eleven lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileSquare310x310Text08, which has an even narrower first column, and TileSquare310x310Text04, which has columns of equal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text06
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text06">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
      <text id="11">Text Field 11, row 6, column 1</text>
      <text id="12">Text Field 12, row 6, column 2</text>
      <text id="13">Text Field 13, row 7, column 1</text>
      <text id="14">Text Field 14, row 7, column 2</text>
      <text id="15">Text Field 15, row 8, column 1</text>
      <text id="16">Text Field 16, row 8, column 2</text>
      <text id="17">Text Field 17, row 9, column 1</text>
      <text id="18">Text Field 18, row 9, column 2</text>
      <text id="19">Text Field 19, row 10, column 1</text>
      <text id="20">Text Field 20, row 10, column 2</text>
      <text id="21">Text Field 21, row 11, column 1</text>
      <text id="22">Text Field 22, row 11, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text07

Note  Windows only; not supported on Windows Phone 8.1

One header string in larger text over eighteen short strings of regular text arranged in two columns of nine lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileSquare310x310Text05, which has a wider first column, and TileSquare310x310Text02, which has columns of equal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text07
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text07">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2, row 1, column 1</text>
      <text id="3">Text Field 3, row 1, column 2</text>
      <text id="4">Text Field 4, row 2, column 1</text>
      <text id="5">Text Field 5, row 2, column 2</text>
      <text id="6">Text Field 6, row 3, column 1</text>
      <text id="7">Text Field 7, row 3, column 2</text>
      <text id="8">Text Field 8, row 4, column 1</text>
      <text id="9">Text Field 9, row 4, column 2</text>
      <text id="10">Text Field 10, row 5, column 1</text>
      <text id="11">Text Field 11, row 5, column 2</text>
      <text id="12">Text Field 12, row 6, column 1</text>
      <text id="13">Text Field 13, row 6, column 2</text>
      <text id="14">Text Field 14, row 7, column 1</text>
      <text id="15">Text Field 15, row 7, column 2</text>
      <text id="16">Text Field 16, row 8, column 1</text>
      <text id="17">Text Field 17, row 8, column 2</text>
      <text id="18">Text Field 18, row 9, column 1</text>
      <text id="19">Text Field 19, row 9, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text08

Note  Windows only; not supported on Windows Phone 8.1

Twenty-two short strings of regular text arranged in two columns of eleven lines each. The column widths are such that the first column acts as a label and the second column as the content. This template is similar to TileSquare310x310Text06, which has a wider first column, and TileSquare310x310Text04, which has columns of equal width.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text08
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text08">
      <text id="1">Text Field 1, row 1, column 1</text>
      <text id="2">Text Field 2, row 1, column 2</text>
      <text id="3">Text Field 3, row 2, column 1</text>
      <text id="4">Text Field 4, row 2, column 2</text>
      <text id="5">Text Field 5, row 3, column 1</text>
      <text id="6">Text Field 6, row 3, column 2</text>
      <text id="7">Text Field 7, row 4, column 1</text>
      <text id="8">Text Field 8, row 4, column 2</text>
      <text id="9">Text Field 9, row 5, column 1</text>
      <text id="10">Text Field 10, row 5, column 2</text>
      <text id="11">Text Field 11, row 6, column 1</text>
      <text id="12">Text Field 12, row 6, column 2</text>
      <text id="13">Text Field 13, row 7, column 1</text>
      <text id="14">Text Field 14, row 7, column 2</text>
      <text id="15">Text Field 15, row 8, column 1</text>
      <text id="16">Text Field 16, row 8, column 2</text>
      <text id="17">Text Field 17, row 9, column 1</text>
      <text id="18">Text Field 18, row 9, column 2</text>
      <text id="19">Text Field 19, row 10, column 1</text>
      <text id="20">Text Field 20, row 10, column 2</text>
      <text id="21">Text Field 21, row 11, column 1</text>
      <text id="22">Text Field 22, row 11, column 2</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310Text09

Note  Windows only; not supported on Windows Phone 8.1

One line of header text wrapped over a maximum of two lines. Beneath are two more, slightly separated lines of header text, each one line only. At the bottom are two lines of regular text, each of one line only.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Text09
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Text09">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2 (larger text)</text>
      <text id="3">Text Field 3 (larger text)</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310TextList01

Note  Windows only; not supported on Windows Phone 8.1

Three stacked notices, each containing one header string in larger text on the first line, two strings of regular text on the next two lines. Text does not wrap.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310TextList01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310TextList01">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4 (larger text)</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7 (larger text)</text>
      <text id="8">Text Field 8</text>
      <text id="9">Text Field 9</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310TextList02

Note  Windows only; not supported on Windows Phone 8.1

Three stacked notices, each containing one string of regular text wrapped over a maximum of three lines.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310TextList02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310TextList02">
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310TextList03

Note  Windows only; not supported on Windows Phone 8.1

Three stacked notices, each containing one header string in larger text over one string of regular text wrapped over a maximum of two lines.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310TextList03
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310TextList03">
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3 (larger text)</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5 (larger text)</text>
      <text id="6">Text Field 6</text>
    </binding>  
  </visual>
</tile>

 

TileSquare310x310BlockAndText01

Note  Windows only; not supported on Windows Phone 8.1

Two main text groups separated by a blank area:

  • One string of large text, which can wrap over up to two lines, sitting over two strings of unwrapped regular text on two lines.
  • Four strings on four lines, separated slightly into two sets. To the side is one string of large block text (this should be numerical) over a single, short line of regular text.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310BlockAndText01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310BlockAndText01">
      <text id="1">Text Field 1 (large text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7</text>
      <text id="8">Text Field 8 (block text)</text>
      <text id="9">Text Field 9</text>
    </binding>  
  </visual>
</tile>

 

Large image-only templates

  • TileSquare310x310Image
  • TileSquare310x310ImageCollection

TileSquare310x310Image

Note  Windows only; not supported on Windows Phone 8.1

One image that fills the entire tile; no text.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310Image
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310Image">
      <image id="1" src="image1.png" alt="alt text"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x248 310x310 434x434 558x558

 

TileSquare310x310ImageCollection

Note  Windows only; not supported on Windows Phone 8.1

Four small square images overlaid across the top one large, full-tile, square image. Note that the small images cut off the top of the large image.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageCollection
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageCollection">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="small image 1 (left)"/>
      <image id="3" src="image3.png" alt="small image 2 (left center)"/>
      <image id="4" src="image4.png" alt="small image 3 (right center)"/>
      <image id="5" src="image5.png" alt="small image 4 (right)"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID

80%

100%

140%

180%

1

248x188

310x235

434x329

558x423

2,5

64x60

80x75

112x105

144x135

3,4

60x60

75x75

105x105

135x135

The leftmost pixel of image 2 and the rightmost pixel of images 4 and 5 are obscured by a border.

 

Large image-and-text templates

  • TileSquare310x310BlockAndText02
  • TileSquare310x310ImageAndText01
  • TileSquare310x310ImageAndText02
  • TileSquare310x310ImageAndTextOverlay01
  • TileSquare310x310ImageAndTextOverlay02
  • TileSquare310x310ImageAndTextOverlay03
  • TileSquare310x310ImageCollectionAndText01
  • TileSquare310x310ImageCollectionAndText02
  • TileSquare310x310SmallImagesAndTextList01
  • TileSquare310x310SmallImagesAndTextList02
  • TileSquare310x310SmallImagesAndTextList03
  • TileSquare310x310SmallImagesAndTextList04
  • TileSquare310x310SmallImagesAndTextList05
  • TileSquare310x310SmallImageAndText01

TileSquare310x310BlockAndText02

Note  Windows only; not supported on Windows Phone 8.1

One string of large block text (this should be numerical); two lines of large header text (no wrap); two sets of two strings in two lines (no wrap). Image in the background. If the text color is light, the image is darkened a bit to improve the text visibility.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310BlockAndText02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310BlockAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (block text)</text>
      <text id="2">Text Field 2 (larger text)</text>
      <text id="3">Text Field 3 (larger text)</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x248 310x310 434x434 558x558

 

TileSquare310x310ImageAndText01

Note  Windows only; not supported on Windows Phone 8.1

One image above one string of regular text wrapped over a maximum of two lines. The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageAndText01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x200 310x250 434x350 558x450

 

TileSquare310x310ImageAndText02

Note  Windows only; not supported on Windows Phone 8.1

One image above two strings of regular text on two lines. Text does not wrap. The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageAndText02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageAndText02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x200 310x250 434x350 558x450

 

TileSquare310x310ImageAndTextOverlay01

Note  Windows only; not supported on Windows Phone 8.1

Background: a single image that fills the entire tile. Foreground: One string of text wrapped over a maximum of three lines. If the text color is light, the image is darkened a bit to improve the text visibility.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageAndTextOverlay01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageAndTextOverlay01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x248 310x310 434x434 558x558

 

TileSquare310x310ImageAndTextOverlay02

Note  Windows only; not supported on Windows Phone 8.1

Background: a single image that fills the entire tile. Foreground: At the top, one string of large text wrapped over a maximum of two lines; at the bottom, one string of regular text wrapped over a maximum of three lines. If the text color is light, the image is darkened a bit to improve the text visibility.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageAndTextOverlay02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageAndTextOverlay02">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x248 310x310 434x434 558x558

 

TileSquare310x310ImageAndTextOverlay03

Note  Windows only; not supported on Windows Phone 8.1

Background: a single image that fills the entire tile. Foreground: At the top, one string of large text wrapped over a maximum of two lines; at the bottom, three strings of regular text on three lines that do not wrap. If the text color is light, the image is darkened a bit to improve the text visibility.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageAndTextOverlay03
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageAndTextOverlay03">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 248x248 310x310 434x434 558x558

 

TileSquare310x310ImageCollectionAndText01

Note  Windows only; not supported on Windows Phone 8.1

TileSquare310x310ImageCollection with the addition of a text ribbon across the bottom of the tile. The text area contains one string of regular text wrapped over a maximum of two lines. Note that the small images cut off the top of the large image while the text area cuts off the bottom of the image. The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageCollectionAndText01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageCollectionAndText01">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="small image 1 (left)"/>
      <image id="3" src="image3.png" alt="small image 2 (left center)"/>
      <image id="4" src="image4.png" alt="small image 3 (right center)"/>
      <image id="5" src="image5.png" alt="small image 4 (right)"/>
      <text id="1">Text Field 1</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID

80%

100%

140%

180%

1

248x148

310x185

434x259

558x333

2,5

64x60

80x75

112x105

144x135

3,4

60x60

75x75

105x105

135x135

The leftmost pixel of image 2 and the rightmost pixel of images 4 and 5 are obscured by a border.

 

TileSquare310x310ImageCollectionAndText02

Note  Windows only; not supported on Windows Phone 8.1

TileSquare310x310ImageCollection with the addition of a text ribbon across the bottom of the tile. The text area contains two strings of regular text on two lines. Text does not wrap. Note that the small images cut off the top of the large image while the text area cuts off the bottom of the image. The width of the text area depends on whether a logo is displayed.

Note  This template allows branding only as "logo" or "none", but not "name". If you set the branding attribute to "name", it will automatically revert to "logo".

 

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310ImageCollectionAndText02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310ImageCollectionAndText02">
      <image id="1" src="image1.png" alt="main image"/>
      <image id="2" src="image2.png" alt="small image 1 (left)"/>
      <image id="3" src="image3.png" alt="small image 2 (left center)"/>
      <image id="4" src="image4.png" alt="small image 3 (right center)"/>
      <image id="5" src="image5.png" alt="small image 4 (right)"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID

80%

100%

140%

180%

1

248x148

310x185

434x259

558x333

2,5

64x60

80x75

112x105

144x135

3,4

60x60

75x75

105x105

135x135

The leftmost pixel of image 2 and the rightmost pixel of images 4 and 5 are obscured by a border.

 

TileSquare310x310SmallImagesAndTextList01

Note  Windows only; not supported on Windows Phone 8.1

Three sets of information, each of which consists of one small square image to the left of one header string in larger text over two strings of regular text on the next two lines. Text does not wrap.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImagesAndTextList01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImagesAndTextList01">
      <image id="1" src="image1.png" alt="alt text"/>
      <image id="2" src="image2.png" alt="alt text"/>
      <image id="3" src="image3.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4 (larger text)</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7 (larger text)</text>
      <text id="8">Text Field 8</text>
      <text id="9">Text Field 9</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1,2,3 48x48 60x60 84x84 108x108

 

TileSquare310x310SmallImagesAndTextList02

Note  Windows only; not supported on Windows Phone 8.1

Up to three sets of information, each of which consists of one small square image to the left of one string of regular text wrapped over a maximum of three lines.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImagesAndTextList02
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImagesAndTextList02">
      <image id="1" src="image1.png" alt="alt text"/>
      <image id="2" src="image2.png" alt="alt text"/>
      <image id="3" src="image3.png" alt="alt text"/>
      <text id="1">Text Field 1</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1,2,3 48x48 60x60 84x84 108x108

 

TileSquare310x310SmallImagesAndTextList03

Note  Windows only; not supported on Windows Phone 8.1

Up to three sets of information, each of which consists of one small square image to the left of one string of large text over one string of regular text wrapped over a maximum of two lines.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImagesAndTextList03
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImagesAndTextList03">
      <image id="1" src="image1.png" alt="alt text"/>
      <image id="2" src="image2.png" alt="alt text"/>
      <image id="3" src="image3.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3 (larger text)</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5 (larger text)</text>
      <text id="6">Text Field 6</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1,2,3 48x48 60x60 84x84 108x108

 

TileSquare310x310SmallImagesAndTextList04

Note  Windows only; not supported on Windows Phone 8.1

Up to three sets of information, each of which consists of one small rectangular image to the right of one string of large text over one string of regular text wrapped over a maximum of two lines.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImagesAndTextList04
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImagesAndTextList04">
      <image id="1" src="image1.png" alt="alt text"/>
      <image id="2" src="image2.png" alt="alt text"/>
      <image id="3" src="image3.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3 (larger text)</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5 (larger text)</text>
      <text id="6">Text Field 6</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1,2,3 36x52 45x65 63x91 81x117

 

TileSquare310x310SmallImagesAndTextList05

Note  Windows only; not supported on Windows Phone 8.1

One line of header text across the top, over three sets of information, each of which consists of one small square image to the left of one header string in larger text over two strings of regular text on the next two lines. Text does not wrap.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImagesAndTextList05
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImagesAndTextList05">
      <image id="1" src="image1.png" alt="alt text"/>
      <image id="2" src="image2.png" alt="alt text"/>
      <image id="3" src="image3.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
      <text id="4">Text Field 4</text>
      <text id="5">Text Field 5</text>
      <text id="6">Text Field 6</text>
      <text id="7">Text Field 7</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1,2,3 48x48 60x60 84x84 108x108

 

TileSquare310x310SmallImageAndText01

Note  Windows only; not supported on Windows Phone 8.1

One medium-sized image in the upper left corner (upper right on right-to-left systems) over a single, unwrapped header string. Beneath this are two sets of regular text: the first wrapped over a maximum of two lines, the second a single line only.

Note  This template requires the visual element to declare version="2".

 

Version 1 name Not supported
Version 2 and 3 name TileSquare310x310SmallImageAndText01
Example
Example XML 
<tile>
  <visual version="2">
    <binding template="TileSquare310x310SmallImageAndText01">
      <image id="1" src="image1.png" alt="alt text"/>
      <text id="1">Text Field 1 (larger text)</text>
      <text id="2">Text Field 2</text>
      <text id="3">Text Field 3</text>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

Image ID 80% 100% 140% 180%
1 64x64 80x80 112x112 144x144

 

Windows Phone-only tiles

  • TileSquare71x71Image
  • TileSquare71x71IconWithBadge
  • TileSquare150x150IconWithBadge
  • TileWide310x150IconWithBadgeAndText

TileSquare71x71Image

Note  Windows Phone only

One square image that fills the entire tile, no text.

Note  This template requires the visual element to declare version="3".

 

Version 1 name Not supported
Version 2 name Not supported
Version 3 name TileSquare71x71Image
Example
Example XML 
<tile>
  <visual version="3">
    <binding template="TileSquare71x71Image">
      <image id="1" src="image1.png" alt="alt text"/>
    </binding>  
  </visual>
</tile>

 

Image sizes per scale (in pixels) on Windows

100%

71x71

140%

100x100

240%

171x171

300%

213x213

400%

284x284

Some values are rounded up to the nearest pixel, but rounding down is equally valid.

 

TileSquare71x71IconWithBadge

Note  Windows Phone only

A single icon image. The icon image's background should be transparent to allow the tile color to show through. A badge is shown to the right of the image, and the image should be sized to allow that badge to have enough room. Unlike other example images on this page, the badge (in this case, the number 36) is included here. This template, being the small tile size, cannot display the app name or logo declared in your manifest.

Important  The tile content and the badge are sent through separate notifications. Think of the badge more as an overlay than as part of the tile's XML content.

 

Note  This template requires the visual element to declare version="3".

 

Version 1 name Not supported
Version 2 name Not supported
Version 3 name TileSquare71x71IconWithBadge
Example
Example XML 
<tile>
    <visual version="3">
        <binding template="TileSquare71x71IconWithBadge">
            <image id="1" src="image1.png" alt="alt text"/>
        </binding>  
    </visual>
</tile>
<badge version="1" value="36"/>

 

TileSquare150x150IconWithBadge

Note  Windows Phone only

A single icon image. The icon image's background should be transparent to allow the tile color to show through. A badge is shown to the right of the image, and the image should be sized to allow that badge to have enough room. Unlike other example images on this page, the badge (in this case, the number 36) is included here.

Important  The tile content and the badge are sent through separate notifications. Think of the badge more as an overlay than as part of the tile's XML content.

 

Note  This template requires the visual element to declare version="3".

 

Version 1 name Not supported
Version 2 name Not supported
Version 3 name TileSquare150x150IconWithBadge
Example
Example XML 
<tile>
    <visual version="3">
        <binding template="TileSquare150x150IconWithBadge">
            <image id="1" src="image1.png" alt="alt text"/>
        </binding>  
    </visual>
</tile>
<badge version="1" value="36"/>

 

TileWide310x150IconWithBadgeAndText

Note  Windows Phone only

In the lower right corner, a single icon image. The icon image's background should be transparent to allow the tile color to show through. A badge is shown to the right of the image. Unlike other example images on this page, the badge (in this case, the number 36) is included here.

Note  If no text elements are specified in this template, the icon image and badge are centered in the tile.

 

In the upper right corner, one header string in larger text on the first line, two strings of regular text on the next two lines. Text does not wrap.

Important  The tile content and the badge are sent through separate notifications. Think of the badge more as an overlay than as part of the tile's XML content.

 

Note  This template requires the visual element to declare version="3".

 

Version 1 name Not supported
Version 2 name Not supported
Version 3 name TileWide310x150IconWithBadgeAndText
Example
Example XML 
<tile>
    <visual version="3">
        <binding template="TileWide310x150IconWithBadgeAndText">
            <image id="1" src="image1.png" alt="alt text"/>
            <text id="1">Text Field 1 (larger text)</text>
            <text id="2">Text Field 2</text>
            <text id="3">Text Field 3</text>
        </binding>  
    </visual>
</tile>
<badge version="1" value="36"/>

 

Versioned templates

Windows 8.1 added new templates for large, square tiles. To distinguish large tiles from medium tiles (known as square tiles in Windows 8), all of the older templates were renamed, leading to the use of versioned templates.

Version 1 notifications are declared by setting the version attribute of the XML payload's visual element to "1" or omitting the attribute altogether. Version 1 notifications meet the Windows 8 definition—original template names and schema elements. Version 1 notifications do not recognize any later template names, which includes all of the large and phone-only templates.

When Windows 8.1 or Windows Phone 8.1 receives a notification that contains a version 1 payload, it recognizes the older template name, substitutes the newer name in its place, and processes the notification normally. However, because a version 1 notification cannot include a binding for a large tile, if the user has sized the app's tile to large, the notification cannot be displayed.

Version 2 notifications are declared by setting the version attribute of the visual to "2". Version 2 notifications recognize the large templates, the new template names, and the fallback attribute of the binding element. In a version 2 notification payload, the old template names are only recognized in the fallback attribute. The template attribute must be set to one of the new template names.

Version 3 notifications differ little from version 2 notifications, except that they recognize the phone-only templates.

How the fallback attribute is used

You can use the version and fallback attributes to send a notification that can be recognized whether it's received by a Windows 8 client or a Windows 8.1 or Windows Phone 8.1 client.

When a Windows 8 device receives a version 2 or 3 visual element, it will not recognize the template value because it only recognizes the older template names. When Windows sees version="2" or version="3" in the payload, it knows to look for the fallback attribute for a recognized value. If the fallback attribute for the binding that matches the tile's current size is missing or contains an unrecognized template name, the notification is not shown; otherwise, the template name specified in the fallback attribute is used and the notification is processed normally.

The phone-only and large templates do not have a fallback value.

Image sizes

Exact sizes are given for each image in each template for each supported scale. You are not required to provide images that specifically match those sizes, but images that do not are scaled and cropped as necessary. For more information, see Tile and toast image sizes.

However, because of time or resources, you might not want or need to supply a full set of assets. In that case, you're going to be inclined to supply the 100% image, since that size is right in the template name, but that would not be ideal. We recommend including the following assets for optimum results. If you only supply a single asset, it should be the larger of the two.

Platform Recommended assets
Windows 180%, 140%
Windows Phone 240%, 140%

 

Important  Images are sized and cropped differently on Windows and Windows Phone 8.1, so the same image in the same template might appear differently on the different devices if sizing or cropping is required.

 

Remarks

Note that when they are displayed on a device set to a right-to-left (RTL) language, templates are generally flipped right-to-left as well.

On Windows, some templates do not display the last line of text if the tile is showing a small logo image or display name, neither of which are shown in the illustrations on this page. For more information on the small logo and display name tile settings, see Quickstart: Creating a default tile using the Microsoft Visual Studio manifest editor.

Note  Windows Phone does not support the small logo on tiles. It shows the display name by default, but this can be turned off so that nothing is shown in that area.

TileTemplateType enumeration

App tiles and badges sample

Quickstart: Sending a tile update

Tiles XML schema

Tile and tile notification overview

Tile and toast image sizes

Using live tiles with different app types