Clock
Usage notes
Clocks are used as time selection form fields.
Default
Toggle markup
<coral-clock></coral-clock>
Preset time
Toggle markup
<coral-clock value="05:04"></coral-clock>
Custom value format
Toggle markup
<coral-clock valueformat="H-m" value="3-4"></coral-clock>
AM/PM display format
Toggle markup
<coral-clock displayformat="hh:mm A" value="15:04"></coral-clock>
Quiet variant
Toggle markup
<coral-clock labelledby="clock-label-4" value="05:04" variant="quiet"></coral-clock>
AM/PM display format quiet variant
Toggle markup
<coral-clock displayformat="hh:mm A" value="15:04" variant="quiet"></coral-clock>
Disabled
Toggle markup
<coral-clock disabled=""></coral-clock>
Invalid
Toggle markup
<coral-clock invalid=""></coral-clock>
ReadOnly
Toggle markup
<coral-clock readonly="" value="15:04"></coral-clock>