Adaptive tile templates: schema and guidance

Here are the elements and attributes you use to create adaptive tiles. For instructions and examples, see Create adaptive tiles.

tile element

<tile>
 
 <!-- Child elements -->
 visual
 
</tile>

visual element

<visual
 version? = integer
 lang? = string
 baseUri? = anyURI
 branding? = "none" | "logo" | "name" | "nameAndLogo"
 addImageQuery? = boolean
 contentId? = string
 displayName? = string >
 
 <!-- Child elements -->
 binding+

</visual>

binding element

<binding
 template = tileTemplateNameV3
 fallback? = tileTemplateNameV1
 lang? = string
 baseUri? = anyURI
 branding? = "none" | "logo" | "name" | "nameAndLogo"
 addImageQuery? = boolean
 contentId? = string
 displayName? = string
 hint-textStacking? = "top" | "center" | "bottom"
 hint-overlay? = [0-100] >

 <!-- Child elements -->
 ( image
 | text
 | group
 )*

</binding>

image element

<image
 src = string
 placement? = "inline" | "background" | "peek"
 alt? = string
 addImageQuery? = boolean
 hint-crop? = "none" | "circle"
 hint-removeMargin? = boolean
 hint-align? = "stretch" | "left" | "center" | "right" />

text element

<text
 lang? = string
 hint-style? = textStyle
 hint-wrap? = boolean
 hint-maxLines? = integer
 hint-minLines? = integer
 hint-align? = "left" | "center" | "right" >

 <!-- text goes here -->

</text>

textStyle values: caption captionSubtle body bodySubtle base baseSubtle subtitle subtitleSubtle title titleSubtle titleNumeral subheader subheaderSubtle subheaderNumeral header headerSubtle headerNumeral

group element

<group>

 <!-- Child elements -->
 subgroup+

</group>

subgroup element

<subgroup
 hint-weight? = [0-100]
 hint-textStacking? = "top" | "center" | "bottom" >

 <!-- Child elements -->
 ( text
 | image
 )*

</subgroup>

Related topics

• Create adaptive tiles