[Rendering] Defined styling colors needs more contrast in Microsoft Teams

Target Platforms

Other

SDK Version

1.5

Application Name

Microsoft Teams

Problem Description

The background colors used for columns and containers in specific styles are too light and do not provide enough contrast against the Adaptive Card’s light gray background in Microsoft Teams. The colors blend in too much, making the elements hard to see and causing the overall styling to look poor. This issue affects all styles:

• good
• emphasis
• attention
• accent
• warning

Screenshots

In classic mode:

In light mode:

In dark mode:

Card JSON

{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.5",
    "body": [
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": "stretch",
                    "style": "good",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "good",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "style": "emphasis",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "emphasis",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "style": "attention",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "attention",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "style": "accent",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "accent",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "style": "warning",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "warning",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                }
            ]
        }
    ]
}

Sample Code Language

No response

Sample Code

No response

Reproduce the supplied Adaptive Card JSON in Microsoft Teams across classic, light, and dark modes, then locate the rendering implementation that defines colors for the good, emphasis, attention, accent, and warning styles. Done means those five styles are visibly distinct from the light gray card background without degrading the other modes.