Primary Button
ESSENTIAL
레이블
OPTIONAL
아이콘
Buttons
Primary Button은 제출, 확인, 구매, 등록 등 주요 행동 유도, 결정할 때 사용합니다.
Buttons
Primary Button은 제출, 확인, 구매, 등록 등 주요 행동 유도, 결정할 때 사용합니다.
Buttons
Primary Button은 제출, 확인, 구매, 등록 등 주요 행동 유도, 결정할 때 사용합니다.
Primary Button
ESSENTIAL
레이블
OPTIONAL
아이콘
Primary Button
ESSENTIAL
레이블
OPTIONAL
아이콘
State
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Properties
Content
Properties
Content
Properties
Content
Spec
Content
Spec
Content
Spec
Width
모바일 환경에서는 뷰포트의 100%로 설정합니다.
Responsive Behavior
콘텐츠 양이 많을 경우 Body 영역 내에서 스크롤이 가능합니다.
Secondary Button
ESSENTIAL
ㅏㅜㅏㅓㅏㅏ
OPTIONAL
Secondary Button
ESSENTIAL
ㅏㅜㅏㅓㅏㅏ
OPTIONAL
Secondary Button
ESSENTIAL
ㅏㅜㅏㅓㅏㅏ
OPTIONAL
State
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Usage
Do
헤더의 닫기 버튼(close)을 항상 제공하여 사용자가 언제든지 닫을 수 있게 합니다.
Do
1개만 선택이 가능한 경우에는 [적용하기] 버튼 없이 바로 적용할 수 있습니다.
Don't
다중 선택의 경우 [적용하기] 버튼을 없애면 안됩니다.
Usage
Do
헤더의 닫기 버튼(close)을 항상 제공하여 사용자가 언제든지 닫을 수 있게 합니다.
Do
1개만 선택이 가능한 경우에는 [적용하기] 버튼 없이 바로 적용할 수 있습니다.
Don't
다중 선택의 경우 [적용하기] 버튼을 없애면 안됩니다.
Usage
Do
헤더의 닫기 버튼(close)을 항상 제공하여 사용자가 언제든지 닫을 수 있게 합니다.
Do
1개만 선택이 가능한 경우에는 [적용하기] 버튼 없이 바로 적용할 수 있습니다.
Don't
다중 선택의 경우 [적용하기] 버튼을 없애면 안됩니다.
Tertiary Button
ESSENTIAL
OPTIONAL
Tertiary Button
ESSENTIAL
OPTIONAL
Tertiary Button
ESSENTIAL
OPTIONAL
State
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Text Button
ESSENTIAL
OPTIONAL
Text Button
ESSENTIAL
OPTIONAL
Text Button
ESSENTIAL
OPTIONAL
State
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Control
state
default
hover
disabled
Left Icon
Right Icon
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Icon Button
ESSENTIAL
OPTIONAL
Icon Button
ESSENTIAL
OPTIONAL
Icon Button
ESSENTIAL
OPTIONAL
State
Control
state
default
hover
disabled
Control
state
default
hover
disabled
Control
state
default
hover
disabled
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
Properties
header | false, true | |||||
footer | false, true | |||||
©Codeit
Contact Us
©Codeit
Contact Us
©Codeit
Contact Us