Input Field Styling
Input fields are where respondents type their answers. You can style them to match the rest of your form design.
Properties
Background color
The fill color of input fields. Use a subtle contrast from the form background so inputs are clearly visible.
Text color
The color of text that respondents type into input fields.
Rounded corners
How rounded the input field corners are. Match this with your form container’s rounded corners setting for a consistent look.
Border
Add a border around input fields:
- Width — border thickness
- Style — solid, dashed, dotted, etc.
- Color — border color
Shadow
Add a shadow effect to input fields for depth. Subtle inset shadows can give inputs a “pressed-in” look.
Tips
- Make sure input text has enough contrast against the input background for readability
- A light border helps define where the input starts and ends, especially on light backgrounds
- Keep input styling consistent with button styling for a cohesive form
- Test with different field types — short text, long text, and email all use these input styles