Components

A round user image, or a placeholder when there is none

An inline notice: an icon, a message, and an optional action

A navigation trail ending at the current page

An action, as a button or as a link styled like one

A frame around a group of content: tinted, raised, or ghost

A native checkbox with Harmo's appearance

A chevron that turns into an arrow while its link or button is hovered or focused

A chevron that folds from down to up while its control is expanded

Arranges and connects a label, description, control, and error message

Narrows a list or table: a dashed chip that opens a Popup and shows what's chosen

SVG icons placed next to text in buttons, links, and breadcrumbs

Single-line native inputs: text, email, search, tel, url, and similar

A key or shortcut, such as Enter or ⌘K, in text or on a button

Navigation, inside text or on its own

The option list inside a popup, with groups, search, and multiple selection

How much of something on a fixed scale, such as password strength

A password field with a show/hide toggle and an optional strength meter

A floating surface for option lists and small panels

A native radio with Harmo's appearance

One choice from a few options shown side by side

A form field that picks one or more options from a list

Settings with a title, a description, and a control beside or under them

A loading indicator, sized to match what is loading

What state something is in, such as a ticket or a campaign run

An on/off switch for settings that apply immediately

Switches between sibling pages or panels, with a sliding hover pill and underline

What something is, such as a ticket tag or "Test run"

Multi-line text that grows as you type

A short description shown on hover and keyboard focus