The Icon
widget represents either a built-in icon or custom icon. You can use Icon
in card messages and dialogs in the following ways:
- Display a standalone icon.
- Display an icon in front of related text, as part of a
DecoratedText
widget. - Display an icon as an interactive button, as part of a
ButtonList
widget.
Example
The following image displays a card consisting of an Icon
component.

Here's the card's JSON:
JSON
{
"cardsV2": [
{
"card": {
"sections": [{
"widgets": [
{
"decoratedText": {
"text": "sasha@example.com",
"startIcon": {
"knownIcon": "EMAIL",
}
}
}
]
}]
}
}
]
}
Available built-in icons for the Icon
widget
To use a built-in icon, you use the knownIcon
field:
{ . . . "knownIcon": "TRAIN", . . . }
The following table lists the built-in icons that are available for card messages:
AIRPLANE | BOOKMARK | ||
BUS | CAR | ||
CLOCK | CONFIRMATION_NUMBER_ICON | ||
DESCRIPTION | DOLLAR | ||
EVENT_SEAT | |||
FLIGHT_ARRIVAL | FLIGHT_DEPARTURE | ||
HOTEL | HOTEL_ROOM_TYPE | ||
INVITE | MAP_PIN | ||
MEMBERSHIP | MULTIPLE_PEOPLE | ||
PERSON | PHONE | ||
RESTAURANT_ICON | SHOPPING_CART | ||
STAR | STORE | ||
TICKET | TRAIN | ||
VIDEO_CAMERA | VIDEO_PLAY |
Icon
JSON representation and fields
An icon displayed in a widget on a card.
JSON representation |
---|
{ "altText": string, "imageType": enum ( |
Fields | |
---|---|
altText
|
Optional. A description of the icon used for accessibility. If unspecified, the default value "Button" is provided. As a best practice, you should set a helpful description for what the icon displays, and if applicable, what it does. For example,
If the icon is set in a
|
imageType
|
The crop style applied to the image. In some cases, applying a
|
Union field
icons
. The icon displayed in the widget on the card.
icons
can be only one of the following:
|
|
knownIcon
|
Display one of the built-in icons provided by Google Workspace.
For example, to display an airplane icon, specify
For a full list of supported icons, see built-in icons . |
iconUrl
|
Display a custom icon hosted at an HTTPS URL. For example:
Supported file types include
|