Spacing

기능별로 섹션을 시각적으로 구분하고 시각적 계층을 구분하기위해 사용되는 요소입니다. Spacing, Grid, Padding Autolayout 등에 사용됩니다.

Contents

DONE

Develop

iOS

DONE

Android

DONE

Spacing

기능별로 섹션을 시각적으로 구분하고 시각적 계층을 구분하기위해 사용되는 요소입니다. Spacing, Grid, Padding Autolayout 등에 사용됩니다.

Contents

DONE

Develop

iOS

DONE

Android

DONE

Spacing

기능별로 섹션을 시각적으로 구분하고 시각적 계층을 구분하기위해 사용되는 요소입니다. Spacing, Grid, Padding Autolayout 등에 사용됩니다.

Preview

Spec

별도의 Fill/Stroke값은 없습니다. 사이즈별 Height값은 아래와 같으며, Width값은 유연하게 사용할 수 있습니다.

Spec

별도의 Fill/Stroke값은 없습니다. 사이즈별 Height값은 아래와 같으며, Width값은 유연하게 사용할 수 있습니다.

Spec

별도의 Fill/Stroke값은 없습니다. 사이즈별 Height값은 아래와 같으며, Width값은 유연하게 사용할 수 있습니다.

Name

Token, Value

Description

Size

yds-spacing-02

yds-spacing-04

yds-spacing-08

Core size

yds-spacing-10

yds-spacing-12

yds-spacing-14

yds-spacing-16

Core size

yds-spacing-20

yds-spacing-24

yds-spacing-28

yds-spacing-32

Core size

yds-spacing-36

yds-spacing-40

yds-spacing-48

Core size

yds-spacing-56

yds-spacing-64

Core size

yds-spacing-96

Usage

Spacing Variable은 상, 하, 좌, 우에 적용하여 사용할 수 있습니다.

Usage

Spacing Variable은 상, 하, 좌, 우에 적용하여 사용할 수 있습니다.

Usage

Spacing Variable은 상, 하, 좌, 우에 적용하여 사용할 수 있습니다.

Apply variable

Spacing Variable 적용 방법은 아래 가이드를 확인해 주세요.

Apply variable

Spacing Variable 적용 방법은 아래 가이드를 확인해 주세요.

Apply variable

Spacing Variable 적용 방법은 아래 가이드를 확인해 주세요.

Credit

Contributor

테나@Terna, 엘라@Ella

Credit

Contributor

테나@Terna, 엘라@Ella

Credit

Contributor

테나@Terna, 엘라@Ella

Design Library

About

Brand

Foundations

Components

Expressions

Resources

Articles

Design Library

Foundation

Graphic

Content

Color

Typography

Iconography

Layout

Radius

Shadow

Spacing