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 targetting supports v1.3 you should use label intead 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

Stock update sample

JSON 
{
	"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
	"type": "AdaptiveCard",
	"version": "1.0",
	"speak": "Microsoft stock is trading at $62.30 a share, which is down .32%",
	"body": [
		{
			"type": "Container",
			"items": [
                {
                    "type": "TextBlock",
                    "text": "Microsoft Corporation",
                    "size": "Medium",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "text": "Nasdaq Global Select: MSFT",
                    "isSubtle": true,
                    "spacing": "None",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "text": "Fri, May 3, 2019 1:00 PM"
                }
			]
		},
		{
			"type": "Container",
			"spacing": "none",
			"items": [
				{
					"type": "ColumnSet",
					"columns": [
						{
							"type": "Column",
							"width": "stretch",
							"items": [
								{
									"type": "TextBlock",
									"text": "128.90",
									"size": "extraLarge"
								},
								{
									"type": "TextBlock",
									"text": "▲ 2.69 USD (2.13%)",
									"color": "good",
									"spacing": "none"
								}
							]
						},
						{
							"type": "Column",
							"width": "auto",
							"items": [
								{
									"type": "FactSet",
									"facts": [
										{
											"title": "Open",
											"value": "127.42"
										},
										{
											"title": "High",
											"value": "129.43"
										},
										{
											"title": "Low",
											"value": "127.25"
										}
									]
								}
							]
						}
					]
				}
			]
		}
	]
}
Data JSON 
{
	"symbol": "MSFT",
	"companyName": "Microsoft Corporation",
	"primaryExchange": "Nasdaq Global Select",
	"sector": "Technology",
	"calculationPrice": "close",
	"open": 127.42,
	"openTime": 1556890200,
	"close": 128.9,
	"closeTime": 1556913600,
	"high": 129.43,
	"low": 127.25,
	"latestPrice": 128.9,
	"latestSource": "Close",
	"latestTime": "May 3, 2019",
	"latestUpdate": 1556913600,
	"latestVolume": 24835154,
	"iexRealtimePrice": null,
	"iexRealtimeSize": null,
	"iexLastUpdated": null,
	"delayedPrice": 128.9,
	"delayedPriceTime": 1556913600,
	"extendedPrice": 129.04,
	"extendedChange": 0.14,
	"extendedChangePercent": 0.00109,
	"extendedPriceTime": 1556917190,
	"previousClose": 126.21,
	"change": 2.69,
	"changePercent": 0.02131,
	"iexMarketPercent": null,
	"iexVolume": null,
	"avgTotalVolume": 22183270,
	"iexBidPrice": null,
	"iexBidSize": null,
	"iexAskPrice": null,
	"iexAskSize": null,
	"marketCap": 987737229888,
	"peRatio": 30.84,
	"week52High": 131.37,
	"week52Low": 93.96,
	"ytdChange": 0.30147812013916003
}
Template JSON 
{
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.2",
    "body": [
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": "${companyName}",
                    "size": "Medium",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "text": "${primaryExchange}: ${symbol}",
                    "isSubtle": true,
                    "spacing": "None",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "text": "{{DATE(${formatEpoch(latestUpdate, 'yyyy-MM-ddTHH:mm:ssZ')}, SHORT)}} {{TIME(${formatEpoch(latestUpdate, 'yyyy-MM-ddTHH:mm:ssZ')})}}"
                }
            ]
        },
        {
            "type": "Container",
            "spacing": "None",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "width": "stretch",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "text": "${formatNumber(latestPrice, 2)} ",
                                    "size": "ExtraLarge"
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "${if(change >= 0, '▲', '▼')} ${formatNumber(change,2)} USD (${formatNumber(changePercent * 100, 2)}%)",
                                    "color": "${if(change >= 0, 'good', 'attention')}",
                                    "spacing": "None"
                                }
                            ]
                        },
                        {
                            "type": "Column",
                            "width": "auto",
                            "items": [
                                {
                                    "type": "FactSet",
                                    "facts": [
                                        {
                                            "title": "Open",
                                            "value": "${open} "
                                        },
                                        {
                                            "title": "High",
                                            "value": "${high} "
                                        },
                                        {
                                            "title": "Low",
                                            "value": "${low} "
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
}
Adaptive Card