Text Inputs
Text
When to use: Names, job titles, short identifiers
What users see: A simple one-line input field
What users see: A simple one-line input field
Text Area
When to use: Comments, explanations, longer responses
What users see: A larger box that grows with text
What users see: A larger box that grows with text
When to use: Collecting valid email addresses
What users see: An input that checks email format automatically
What users see: An input that checks email format automatically
Numbers and Money
Number
When to use: Counts, IDs, reference numbers
What users see: A numeric field with simple validation
What users see: A numeric field with simple validation
Amount
When to use: Loan amounts, income, premiums
What users see: A money field with proper formatting
What users see: A money field with proper formatting
Percentage
When to use: Interest rates, completion %
What users see: Input with automatic % handling
What users see: Input with automatic % handling
Age
When to use: Insurance or eligibility flows
What users see: Age field with realistic ranges
What users see: Age field with realistic ranges
Year
When to use: Tax year, graduation year, policy start year
What users see: Input restricted to year values
What users see: Input restricted to year values
Formatted Number
When to use: Phone numbers, IDs, custom formats
What users see: Input that applies formatting as you type
What users see: Input that applies formatting as you type
Files, Dates & Locations
Date Picker
When to use: Birth dates, appointments, policy start dates
What users see: A simple calendar interface
What users see: A simple calendar interface
File Upload
When to use: Document submission, ID photos, attachments
What users see: Upload button with file size/type checks
What users see: Upload button with file size/type checks
DAWA Address
When to use: Any address collection in Denmark
What users see: Validated addresses from the official DAWA service
What users see: Validated addresses from the official DAWA service
CPR/CVR Lookup
When to use: Danish customer or company verification
What users see: Input that validates CPR or CVR numbers
What users see: Input that validates CPR or CVR numbers
Best Practices
- Keep it short: Ask one thing at a time
- Guide users: Use placeholders and helper text
- Validate gently: Show clear messages only when needed
- Think mobile: Make sure inputs are easy to tap and type on small screens
Example Recipe
Basic Contact Form:Message → Text (Name) → Email → Date Picker (Preferred time) → File Upload (Optional document)