Form fields

Consistent form elements help us quickly design effective web forms. So far we’ve only developed text inputs, with checkboxes, selects, and radio buttons in the backlog. In the meantime, review our Effective forms guide for user experience tips.

Repository
  • cf-forms

    Forms in the Capital Framework

StyleView code

Text input fields

Text input fields are used for requesting narratives, explanations, or other information that requires lines of free-form text.

Single-line

Multi-line

StatesView code

Normal

  • Gray 1px solid border

Focus

  • Pacific Blue 1px solid border

Error

  • Red Orange 1px solid border
  • Error minicon

Success

  • CFPB Green 1px solid border
  • Success minicon