dta.gov.au

The .gov.au means it’s official

Australian government websites always use a .gov.au domain. Before sharing sensitive information online, make sure you’re on a .gov.au site by inspecting your browser’s address (or 'location') bar.

This site is secure.

The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Text inputs

v2.1.2

Text inputs are input fields typically used in forms that allow the user to enter text data in a structured format. Text inputs should be accompanied by labels.

Released

History
View changes
Install
npm i @gov.au/text-inputs
Tags
Requires
Contributors
  • Alexander Sadleir avatar picture
  • Patrick De Young avatar picture
  • Dominik Wilkowski avatar picture
  • Petra Gulicher avatar picture
  • Simon Pascal Klein avatar picture
  • Trevor Brennan avatar picture
  • Hannah J. Nicdao avatar picture
  • Gary Broadbent avatar picture
  • Julian Fleetwood avatar picture
  • Kiri Hoy avatar picture
  • Alex Page avatar picture

Colour impairment

How the text inputs are viewed with various colour blindnesses

Example

Grayscale

How the text inputs are viewed with total colour blindness.

Example

Keyboard accessibility

How keyboard navigation works with text inputs.

Example

Screen readers

A text input field.

A text input field [edit text].

A disabled input field.

A disabled input field [dimmed edit text, _placeholder_].

How the text inputs demo is described by assistive technology.

As read with macOS High Sierra VoiceOver.