Dialogs

사용자의 흐름을 방해하지 않고 정보를 전달하거나 피드백을 제공하는 구성 요소와, 사용자의 주의를 집중시키거나 명확한 결정을 요구하는 구성 요소를 포함합니다.

Toast

사용자의 작업 결과를 간단히 알려주는 짧은 피드백 메시지입니다. 가로 크기는 텍스트 길이에 따라 가변적으로 조정되며, 디바이스 유형에 따라 최대 너비(Max-width)가 다르게 설정됩니다.

This is a toast message.
Controls
Device
Icon
Message

Snackbar / Banner

화면 하단에 나타나 짧은 알림이나 행동 옵션을 제공하는 구성 요소입니다. 자동으로 사라지면 Snackbar, 사용자가 닫기 전까지 유지되면 Banner로 구분됩니다. 두 형태 모두 간단한 액션을 포함할 수 있습니다.

Feedback title

This is a description text.

Controls
Device
Icon
Title
Description

Push

사용자의 행동과 무관하게, 앱 내에서 발생한 알림이나 안내를 전달하는 구성 요소입니다. 화면 상단에 노출되어, 중요 이벤트나 시스템 정보를 즉시 안내합니다.

Enter a Feedback Text.

The description area supports up to two lines.

Controls
Device
Thumbnail
Size
Stroke
Round
Title
Description

Tooltip

특정 요소에 대한 보조 설명이나 안내를 제공하는 구성 요소입니다. 사용자의 포커스나 호버 동작에 따라 일시적으로 표시됩니다.

This is a tooltip message.

Controls
Size
Direction
Alignment
Arrow (Tip)
Close Button
Action

Alert / Confirm

앱 내에서 중요한 정보를 안내하거나 사용자의 결정을 요청하는 구성 요소입니다.

Dialog Title

This is the dialog description message.

Controls
Device
Type
Title

Bottom Sheet

화면 하단에서 추가 정보를 제공하거나 사용자의 보조적인 행동을 유도하는 시트입니다.

Content Area

This is the content area of the bottom sheet.

Controls
Device
Type

Action Sheet

사용자가 수행할 수 있는 하나의 행동을 선택하도록 안내하며, 선택 즉시 시트가 자동으로 닫힙니다.

Controls
Device
Items
Destructive