Skip to content

role textbox

Text field draft v0.1.0

Lets people enter or edit a single line of text.

A text field collects one line of free text: a name, an email address, a search term, a quantity typed as text. It has a visible label above, an optional description and, when its value fails validation, an error message under it. Several lines of text are a Textarea; a choice among known values is a Select.

Playground

HTML
<div class="ds-text-field" data-size="medium">
  <label
    class="ds-text-field__label"
    data-part="label"
    for="ds-text-field-27"
  >Full name</label>
  <input
    type="text"
    class="ds-text-field__control"
    data-part="control"
    id="ds-text-field-27"
    value="Ada Lovelace"
  >
</div>