Go Main page
Go Main page

Web components

Foundations
Components
About
cover

components

Icon Highlighted

v.1.0.0 | Saturn
Healthy
StorybookFigma

Component

Play with the component with our playground.

Anatomy

Foo

NameDescription

1

Container
Required
width
and
height
Fluid (content).

2

Icon
Required
width
and
height
Fixed.

Sizes

Extra small

  • 24px

    • Small

  • 32px

    • Medium

  • 48px

    • Large

  • 56px

    • Extra large

  • 64px

    • Do's and dont's

    Foo

    Do’s

    Use an accessible contrast combination of colors.

    Foo

    Don’t

    Do not use a non-accessible contrast combination of colors.

    Foo

    Do’s

    Use the same color range for icon and background icon container.

    Foo

    Don’t

    Do not use a different color range for icon and background icon container.

    Icon HighlightedUsage
    Icon HighlightedCode API