Label combos, helper text, dividers, input groups, and standard form layout
Applies a red border to any input in an error state
Password input with a show/hide toggle button positioned inside the field
Label above, input below, shared grey background with bottom border focus effect
Checkbox with label, flex layout, cursor pointer, user-select none
Label above (separate), input below with standard border and focus color
Checkbox variant with flex layout, same pattern as type one but different warning spacing
Visual comparison of the two label-input combo styles
Small descriptive text below form fields, with an optional question-mark variant
Section heading with a horizontal line extending to the right — used to separate form sections
Standard form layout rules — adds consistent spacing between label, fieldset, and form-label-like elements
Base fieldset class — legend spacing. Structure: <fieldset> → <legend> (optional) → <div> → content
Radio/checkbox options displayed inline — uses <div> wrapper for flex layout
Small, subtle hint text inside labels — typically used for "(optional)" notes
All form pattern classes used together in a realistic registration form