Basic · Space
Space
Set the spacing between components.

Demos

How to import

Basic Usage

Alignment

You can use align to set the alignment, optional: start, center(default), end, baseline.

Spacing

You can use spacing to set the spacing size, optional: tight (8px, default), medium (16px), loose (24px), and allow to pass in number to customize the spacing size, and also support to pass in array to set the horizontal and vertical spacing at the same time.

Direction

You can use vertical to set whether the spacing is vertical, the default is false.

Wrap

When the spacing is horizontal,you can use wrap to set whether to wrap automatically, the default is false.

API Reference

PropertiesInstructionsTypeDefaultVersion
alignAlignment, optional: startendcenterbaselinestringcenter>=1.17.0
classNameClass namestring->=1.17.0
spacingThe space size, optional: loosemediumtight 、number and arraystring|number|arraymedium>=1.17.0
styleInline styleCSSProperties->=1.17.0
verticalSet to vertical spacingbooleanfalse>=1.17.0
wrapWhether to wrapbooleanfalse>=1.17.0

Design Tokens

© 2021 - 2022 Semi Design. All rights reserved.

京ICP备19058139号-13浙公网安备 33011002016131号

Designed & Developed with love by Douyin FE & MED