Skip to main content
SpotIcon
@coinbase/cds-web@8.13.6
An icon-sized illustration component for displaying spot graphics.
Import
import { SpotIcon } from '@coinbase/cds-web/illustratations/SpotIcon'
ChangelogView changelogSourceView source codeStorybookView StorybookFigmaView Figma
Related components

Illustrations

dimension prop:
32x32
24x24

Basic example

Loading...
Live Code
<SpotIcon name="shield" dimension="32x32" />

scaleMultiplier prop

If no predefined dimensions fit your use case, you can use the scaleMultiplier prop to scale the illustration.

Use scaleMultiplier sparingly and with caution. We have predefined dimensions to ensure that illustrations scale elegantly.

Loading...
Live Code
<SpotIcon name="shield" scaleMultiplier={1.5} />

Scaling with dimension

If dimension and scaleMultiplier are both provided the component will scale based on the provided dimension.

Loading...
Live Code
<SpotIcon name="shield" dimension="24x24" scaleMultiplier={1.5} />

Is this page useful?

Coinbase Design is an open-source, adaptable system of guidelines, components, and tools that aid the best practices of user interface design for crypto products.