Select

Use <select> for choosing one option from a short list. In Nuxt / PLAI use USelect.

Element	Source
Border, surface, chevron, disabled	Nuxt UI zinc / USelect defaults
Focus border and ring	CI --ci-color-text-link
Error state	Nuxt UI semantic red

Live examples

Document type Select type Contract Correspondence Court filing

Error and disabled

Role Select role Member Admin

Choose a role to continue.

Region Fixed by contract

HTML

<label class="ci-label" for="doctype">Document type</label>
<select id="doctype" class="ci-select">
  <option value="">Select type</option>
  <option value="contract">Contract</option>
</select>

Accessibility

• Always include a visible <label>.
• For long lists or search, consider an app-level combobox — native <select> suits roughly up to ~15 options.
• Empty first option (value="") works as an unselected placeholder when the field is required.

Related patterns

• Text field — free-text entry
• Form layout — field composition