LifeDS

Component

Native Select

Uses the native browser <select> element — better performance, native accessibility and mobile-optimized dropdowns. Use Select instead when you need full control over styling of the popup.

NativeSelectsize: sm · default · lg · xl (default) — disabled · aria-invalid
NativeSelectOptGrouplabel · disabled
NativeSelectOptionvalue · disabled
Playground

Basic

Groups

Sizes

size="sm" · "default" · "lg" · "xl"

Disabled

Invalid — with error message

RTL support

Tokens used

6 semantic tokens consumed by this component.

--inputInput
bg-inputborder-input
--ringRing
ring-ringring
--destructiveDestructive
bg-destructivetext-destructiveborder-destructivering-destructive
--muted-foregroundMuted Foreground
text-muted-foreground
--primaryPrimary
bg-primarytext-primaryborder-primaryring-primary
--primary-foregroundPrimary Foreground
text-primary-foregroundbg-primary-foreground