Alternate Illustration Accents
A collection of bespoke Standard Life Illustration SVGs.
Usage
Include the illustrations as inline SVGs for the most flexibility and control over sizing and colours.
When using illustration icons on a dark background, use [namespace]-illustration--alt-accent on the element or its parent to modify the colour accent built into the illustration.
Accessible attributes
| Accessible attribute | Description |
|---|---|
aria-hidden="true" |
When an icon is used for only decorative purposes add this attribute to the icon's tag. |
Modifier selectors
| Modifier selector | Description |
|---|---|
slb-illustration--alt-accent |
Alternative illustration icon to display on dark backgrounds. |