Alexa Icon

Displays an icon in Alexa Vector Graphic (AVG) format. You can use an icon from an Amazon-provided library of icons, or provide your own.

Import the alexa-icon package

To use the package, add the alexa-icon package to the import array in your document. The latest version of the alexa-icon package is 1.0.0.

Example of the imports section of a document:

Copied to clipboard.

{
  "import": [
    {
      "name": "alexa-icon",
      "version": "1.0.0"
    }
  ]
}

The alexa-icon package includes both the AlexaIcon responsive component and the library of icons.

For details about the alexa-icon package, see Alexa Icon Package.

AlexaIcon parameters

Name Type Default Description Version added

iconColor

Color

black

Color of the icon.

1.0.0

iconName

String

Name of an icon in the Alexa Icon Library, such as ic_battery_low

1.0.0

iconSize

Dimension

24

Size of the icon.

1.0.0

iconSource

String

If the AVG icon is located somewhere else, provide URL to icon JSON

1.0.0

iconStyle

Custom style to apply to the icon. Use this to change the icon opacity, fill colors, and stroke colors for different component states. Define the style in the styles property of the APL document. For details about defining styles, see APL Style Definition and Evaluation.

1.0.0

lang

String

${environment.lang ? environment.lang : 'en-US' }

The lang property of AlexaIcon. Set the lang property to a BCP-47 string (e.g., en-US). By default, it uses environment lang.

1.0.0

layoutDirection

String

${environment.layoutDirection}

The layoutDirection of AlexaIcon. It can be LTR or RTL. By default, it uses environment layoutDirection.

1.0.0

type

String

Always set to AlexaIcon.

1.0.0

AlexaIcon example