MYDS Logo

MYDS

Beta

Pill

Represent tags or categories in a textfield. Pills can contain text and may include an "x" button to allow for easy removal.

Size

pills-size.pngpills-size.png

Size properties help ensure that the pills are appropriately proportioned and visually consistent with other UI elements.

Disabled

pills-disabled.pngpills-disabled.png

When a pill is disabled, hide the "x" or remove icon to indicate it is not interactive.

Trailing icon

pills-trailing-icon.pngpills-trailing-icon.png

  1. An optional button within the pill that allows users to remove the pill from the textfield.

On this page