Input

A text entry field that allows users to provide information and data.

Usage

Inputs should always have an associated label. Use placeholder text to provide a hint about the expected data, but do not use placeholders as a replacement for labels.

Content

Default Input

Standard text input with a neutral border.

Spec

  • Focus State: 2px ring using the primary brand color (#D74D0F) at 50% opacity.
  • Border: 1px solid Neutral (#E5E5E5).
  • Radius: Medium (0.5rem).

Anatomy

Placeholder text
Focus ring indicator