components
Countdown
A visual cue indicating the duration of time.
Variants
Anatomy
Properties
Properties
Vertical Exposure
Description
1. Container
unremovable
changeable
Color
icon alert
exposed
Width
hug
none
Height
fixed (20px)
none
Radius
4px
none
2. Separator
unremovable
unchangeable
Text style
body 3 - bold
none
Color
text alert
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
3. Text number
unremovable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-center
none
Overflow handling
truncation : none
none
Max line
no max line
none
Maximum 2 digit for hour and minute
4. Text milisecond
removable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
Dimension
Variants
Anatomy
Properties
Properties
Vertical Exposure
Description
1. Container
unremovable
changeable
Color
icon alert
exposed
Width
hug
none
Height
fixed (20px)
none
Radius
4px
none
2. Separator
unremovable
unchangeable
Text style
body 3 - bold
none
Color
text alert
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
3. Text number
unremovable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-center
none
Overflow handling
truncation : none
none
Max line
no max line
none
Maximum 2 digit for hour and minute
4. Text milisecond
removable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
Dimension
Variants
Anatomy
Properties
Properties
Vertical Exposure
Description
1. Container
unremovable
changeable
Color
icon alert
exposed
Width
hug
none
Height
fixed (20px)
none
Radius
4px
none
2. Separator
unremovable
unchangeable
Text style
body 3 - bold
none
Color
text alert
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
3. Text number
unremovable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-center
none
Overflow handling
truncation : none
none
Max line
no max line
none
Maximum 2 digit for hour and minute
4. Text milisecond
removable
changeable
Text style
body 3 - bold
small
none
Color
text invert (default)
all text color token
exposed
Alignment
align-left
none
Overflow handling
truncation : none
none
Max line
no max line
none
Dimension
