Microsoft Teams adaptive card designer for GitHub PRs

Edit Adaptive Card v1.5 JSON on the left, see a live Microsoft Teams preview on the right. Pre-loaded with four GitHub-PR-focused templates: PR opened, PR ready for review, PR merged, and CI failed. Copy-paste ready.

Targeting: microsoft teams adaptive card designer · Last updated 2026-05-02

Skip the manual setup

PullNotifier installs from Microsoft AppSource in 5 minutes — no YAML, no Power Automate flows.

Try the designer

Template

Plain notification when a new PR is created.

adaptive-card.json

{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.5",
  "body": [
    {
      "type": "TextBlock",
      "size": "Medium",
      "weight": "Bolder",
      "text": "PR #1234: Add dark mode toggle"
    },
    {
      "type": "ColumnSet",
      "columns": [
        {
          "type": "Column",
          "width": "auto",
          "items": [
            {
              "type": "Image",
              "url": "https://avatars.githubusercontent.com/u/9919",
              "size": "Small",
              "style": "Person"
            }
          ]
        },
        {
          "type": "Column",
          "width": "stretch",
          "items": [
            { "type": "TextBlock", "weight": "Bolder", "text": "sarah-chen" },
            { "type": "TextBlock", "spacing": "None", "text": "acme/web-app · open", "isSubtle": true }
          ]
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "Adds a system-aware dark mode toggle to the user settings menu.",
      "wrap": true
    }
  ],
  "actions": [
    { "type": "Action.OpenUrl", "title": "View PR", "url": "https://github.com/acme/web-app/pull/1234" },
    { "type": "Action.OpenUrl", "title": "Files changed", "url": "https://github.com/acme/web-app/pull/1234/files" }
  ]
}

Microsoft Teams preview

PullNotifier10:42 AM

PR #1234: Add dark mode toggle

sarah-chen

acme/web-app · open

Adds a system-aware dark mode toggle to the user settings menu.

View PR Files changed

Skip the JSON

Install PullNotifier and ship polished GitHub PR adaptive cards in 5 minutes.

How it works

The designer is a thin wrapper around the Adaptive Card v1.5 schema — the same schema Microsoft Teams uses internally for cards posted via Power Automate, incoming webhooks, and bot framework applications. Pick a template, edit the JSON, and the live preview updates as you type.

Templates: four pre-built GitHub-PR scenarios. Switch between them with the dropdown.
JSON editor: edit the card body and actions. Indentation and tab size are preserved.
Live preview: renders the card in a Microsoft-Teams-styled container so you can see what it will look like before you ship.
Copy JSON: grabs the current editor contents and copies them to your clipboard.
Reset: restores the active template back to its original state.

When to use a custom adaptive card

Build a custom adaptive card when you are wiring up your own GitHub-to-Microsoft-Teams pipeline — for example, a Power Automate Workflow, a custom GitHub Action that posts to an incoming webhook, or a bespoke bot application. Use the JSON from this designer as your payload.

Skip custom cards if you just want polished PR notifications with smart filtering, in-place card updates, GitHub-Teams user mapping, and code review reminders. PullNotifier ships all of this out of the box from the Microsoft AppSource listing — no JSON to maintain.

Office 365 Connectors retired on March 31, 2026. Adaptive Card v1.5 is the current path forward for Microsoft Teams notifications.

Supported preview elements

The live preview is a lightweight renderer that handles the elements most commonly used for PR notifications. Cards using these element types will render faithfully:

TextBlock with weight, size, color, isSubtle, wrap
ColumnSet with columns (width: auto | stretch)
Image with style: Person and size: Small | Medium | Large
Container with optional style (good, attention, warning, accent, emphasis)
FactSet with label / value pairs
Action.OpenUrl as a row of action buttons

Other Adaptive Card v1.5 elements (Input.*, Action.Submit, RichTextBlock, Media, etc.) are valid JSON but render as a placeholder note in the preview. They will still work in real Microsoft Teams.

Frequently asked

What is an adaptive card?

An Adaptive Card is a JSON-based UI snippet that renders inside host apps like Microsoft Teams, Outlook, and Webex. The schema is open and cross-platform. Microsoft Teams supports Adaptive Cards up to v1.5.

How do I use this designer?

Pick a template from the dropdown, edit the JSON in the left pane, watch the preview update on the right, then click Copy JSON when you are happy. Paste the JSON into your Power Automate Workflow, GitHub Action, or webhook payload.

Does it support Adaptive Card v1.5?

Yes. All four templates use Adaptive Card v1.5 — the latest schema version Microsoft Teams renders. The "version" field is locked to "1.5" in every template.

Can I export to Power Automate?

Yes. Click Copy JSON and paste the result into the "Adaptive Card" field of the "Post adaptive card in a chat or channel" action in Power Automate. Replace any sample values with dynamic content from your trigger.

How do I @-mention someone in a Microsoft Teams adaptive card?

Add a "msteams" object at the root with an "entities" array describing each mentioned user (id + name), then reference them inline as <at>Display Name</at> in any TextBlock. Both pieces are required for Microsoft Teams to fire the notification. The "PR ready for review" template shows the full pattern.

Will the cards work after the Office 365 Connectors retirement?

Yes. The Office 365 Connectors retirement (March 31, 2026) only affected the legacy MessageCard format. Adaptive Card v1.5 is the modern, supported path and works with Power Automate Workflows, the bot framework, and incoming webhooks added through the Workflows app.