Related components
Text areas for multi-line freeform responses.
Date selectors when you want someone to choose a not-yet-known date, like for appointment scheduling.
<gcds-input>
Also called: text input, input field.
An input is a space to enter short-form information in response to a question or instruction.
Take a look at what inputs do to see if they fit the problem you're solving for. Then select the best input type for the use case you need to meet.
Use an input to gather single-line information from a person when you're expecting a person will write:
Note: Only collect information you're authorized to handle and be sure to safeguard it to Government of Canada standards.
Text areas for multi-line freeform responses.
Date selectors when you want someone to choose a not-yet-known date, like for appointment scheduling.
Set the input type based on how the input will validate the values a person enters.
The input type
attribute accepts the following options:
Tip: Communicate any password constraints in the hint text for the input so the person choosing the password knows exactly what the rules are.
To reject values that are non numerical.
Tip: When you set a constraint, like a numerical range, use hint text to relay a precise instruction.
To collect search queries.
To collect a URL, like a web address or domain name.
Have questions or a request? Give feedback on our contact form.
Something's wrong? Raise it through GitHub with an