Icon Color A Icon’s color can be modified per use case. Important Notes: Reference the schema for all options. Additionally, a CSS custom property is available to change the icon color to any brand color. Define --e-bolt-icon-color inline style rule to set the desired color. Reference Color Tokens for all available brand colors. Again, Icon element can be used in tandem with Shape element to create a square or circle container around the icon. In such scenario, size and color should not be set on the Icon, they should be set on the Shape instead. Demo
Twig
{% include '@bolt-elements-icon/icon.twig' with {
  color: 'navy',
  ...
} only %}
HTML
<svg enable-background="new 0 0 32 32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" class="e-bolt-icon e-bolt-icon--navy" aria-hidden="true">...</svg>