Samples and Templates

These samples are just a teaser of the type of cards you can create. Go ahead and tweak them to make any scenario possible!

Important note about accessibility: In version 1.3 of the schema we introduced a label property on Inputs to improve accessibility. If the Host app you are targeting supports v1.3 you should use label instead of a TextBlock as seen in some samples below. Once most Host apps have updated to the latest version we will update the samples accordingly.

Choose Sample:

Templating enables the separation of data from the layout in an Adaptive Card. It helps design a card once, and then populate it with real data at runtime. Note: The binding syntax changed in May 2020. Get started with templating

Order delivery sample

JSON
{ 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.5",
    "body": [
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": 2,
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Redmond, WA",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "Malt & Vine",
                            "weight": "bolder",
                            "size": "extraLarge",
                            "spacing": "none",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "4.5 stars (176 reviews) · mid-priced",
                            "isSubtle": true,
                            "spacing": "none",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "**Blaire S.** said \"Great concept and a wide selection of beers both on tap and bottled! Smaller wine selection than I wanted, but the variety of beers certainly made up for that. Although I didn't order anything, my boyfriend got a beer and he loved it. Their prices are fair too. \n\nThe concept is really awesome. It's a bar/store that you can bring outside food into. The place was pretty packed tonight. I wish we had stayed for more than one drink. I would have loved to sample everything!\"",
                            "size": "small",
                            "wrap": true,
                            "maxLines": 3
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": 1,
                    "items": [
                        {
                            "type": "Image",
                            "url": "https://picsum.photos/300?image=882",
                            "size": "auto",
                            "altText": "Seated guest drinking a cup of coffee"
                        }
                    ]
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.Submit",
            "title": "Pickup",
            "tooltip": "Schedule order for pickup"
        },
        {
            "type": "Action.Submit",
            "title": "Delivery",
            "isEnabled": false,
            "tooltip": "Your location is too far for delivery"
        }
    ]
}
Data JSON
{
	"name": "Malt \u0026 Vine",
	"address": {
		"addressLocality": "Redmond",
		"addressRegion": "WA",
		"streetAddress": "16851 Redmond Way",
		"postalCode": "98052",
		"addressCountry": "US"
	},
	"review": [{
		"reviewRating": {
		  "ratingValue": 4
		},
		"datePublished": "2014-11-28",
		"description": "Great concept and a wide selection of beers both on tap and bottled! Smaller wine selection than I wanted, but the variety of beers certainly made up for that. Although I didn't order anything, my boyfriend got a beer and he loved it. Their prices are fair too. \n\nThe concept is really awesome. It's a bar/store that you can bring outside food into. The place was pretty packed tonight. I wish we had stayed for more than one drink. I would have loved to sample everything!",
		"author": "Blaire S."
	}]
}
Template JSON
{ 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.5",
    "body": [
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": 2,
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "${address.addressLocality}, ${address.addressRegion}",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "${name}",
                            "weight": "bolder",
                            "size": "extraLarge",
                            "spacing": "none",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "4.5 stars (176 reviews) · mid-priced",
                            "isSubtle": true,
                            "spacing": "none",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "**${review[0].author}** said \"${review[0].description}\"",
                            "size": "small",
                            "wrap": true,
                            "maxLines": 3
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": 1,
                    "items": [
                        {
                            "type": "Image",
                            "url": "https://picsum.photos/300?image=882",
                            "size": "auto",
                            "altText": "Seated guest drinking a cup of coffee"
                        }
                    ]
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.Submit",
            "title": "Pickup",
            "tooltip": "Schedule order for pickup"
        },
        {
            "type": "Action.Submit",
            "title": "Delivery",
            "isEnabled": false,
            "tooltip": "Your location is too far for delivery"
        }
    ]
}
Adaptive Card