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
Understanding Browser Autocomplete
Understanding Browser Autocomplete
What is Autocomplete?
Browser autocomplete helps users fill forms faster by suggesting previously saved information like names, addresses, payment details, and more. According to Google, proper autocomplete implementation can reduce bounce rates by up to 70%.When to Use Autocomplete
Enable autocomplete when collecting standard information users likely have saved:- Personal details (name, email, phone)
- Address information
- Payment details
- Login credentials
- Collecting sensitive unique information (reference numbers, case IDs)
- Creating forms where pre-filled data causes confusion
- Browser suggestions interfere with user experience
Browser Autofill Options
Select from these common autofill behaviors. For the complete list of all available values, see the MDN autocomplete reference.* When
off is selected, the system automatically rotates the autocomplete value to prevent browsers from overriding your choice.Quick Start Guide
For most use cases: Select a standard behavior from the Browser Autofill dropdownTo enable helpful autofill: Usename, email, cc-number, etc. to reduce bounce ratesTo disable autofill (simple): Select off - the system handles rotation automaticallyTo disable autofill (advanced): Use the Advanced Autofill field with a variable that rotates values weekly/bi-weekly to outsmart Chrome’s MLFor specific autocomplete values: Use the Advanced Autofill field with a raw string. Refer to the complete MDN autocomplete specification for all available values.Contact support@wizflow.io if you want to include a new autocomplete property.
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
Slider
When to use: Bounded range selection
What users see: A draggable handle between a minimum and maximum, with optional manual entry
What users see: A draggable handle between a minimum and maximum, with optional manual entry
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
Address
When to use: Any address collection in Denmark
What users see: Validated Danish addresses, powered by RTB
What users see: Validated Danish addresses, powered by RTB
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)

