Skip to main content

Spacer

Note

The violet color

in the examples is used to highlight the space added by the component. Hover the element container to hide the spacing preview.

<Spacer />

Highlighted props

For the complete list of props, use your IDE's autocomplete functionality.

Sizes

<Spacer size='s' />

px (default)

xs

s

m

Border

<Spacer
size='m'
border
/>

Icon

<Spacer
icon={icons.emptyRect}
/>
<Spacer
icon={icons.emptyRect}
border
/>

Text

<Spacer
text='This is a label'
/>
<Spacer
text='This is a label'
border
/>

With subtitle

<Spacer
text='This is a label'
subtitle='Subtitle'
/>
<Spacer
text='This is a label'
subtitle='Subtitle'
border
/>

Combined

<Spacer
icon={icons.emptyRect}
text='This is a label'
subtitle='Subtitle'
border
/>