●Astry Design System—04 · Forms & interaction
Form & interaction
components.
Twenty-four primitives, every state covered. All inputs share size, focus and error treatment across light and dark.
- 24
- Primitives
- 3
- Size scales
- AA
- WCAG 2.2
- ∞
- Compositions
01
Text inputs
Default
Must be a company address.
Password
States
That doesn't look like a valid email.
Sizes
Disabled & read-only
Textarea
02
Select & multi-select
Industry select
Tag input
agenticoperationsembedded
Press Enter to add
Combobox
03
Selection controls
Checkbox
Radio · plan
Switch
04
Card-style selectors
05
Date & time pickers
Date · May 2026
MoTuWeThFrSaSu
Time
:
Showing 30-min slots · timezone Europe/Paris
06
OTP · pincode
Enter the code we sent
We sent a 6-digit code to m@astry.agency
07
File upload
Drag & drop
Avatar upload
Square PNG & JPG, ≥ 256×256.
08
Sliders · range
Throughput target (req/s)64
Default — disabled visual42
09
Color picker
Pick brand color
#1D4ED8live preview
10
Stepper · multi-step form
Account
Create your workspace
Workflow
Pick a template
Review
Confirm settings
Done
Ship it
Step 3 of 4
11
Tabs · variants
Pill
Underline
12
Misc
Filter chips
Q1 2026EngineeringOwner: martin
Sort
Tooltip
Press ⌘K to open palette
Online · last seen now
+1
Online · last seen now+1