Selects
Selects create dropdowns for selecting a single entry from a list.
Default Select
The Default Select description from Figma goes here
1<select class="form-select" aria-label="Default select example">
2 <option selected>Open this select menu</option>
3 <option value="1">One</option>
4 <option value="2">Two</option>
5 <option value="3">Three</option>
6</select>
Disabled Select
The Disabled Select description from Figma goes here
1<select class="form-select" aria-label="Default select example" disabled>
2 <option selected>Open this select menu</option>
3 <option value="1">One</option>
4 <option value="2">Two</option>
5 <option value="3">Three</option>
6</select>Error Select
The Error Select description from Figma goes here
1<select class="form-select is-invalid" aria-label="Default select example">
2 <option selected>Open this select menu</option>
3 <option value="1">One</option>
4 <option value="2">Two</option>
5 <option value="3">Three</option>
6</select>Accessibility
Make it clear what this select widget does for the user.
-
What to do with select
-
What not to do with select
Classes
Complete list of all CSS classes for the component.
| Name | Class |
|---|---|
| Default Select | select select-default |
| Disabled Select | select select-disabled |
| Error Select | select select-error |