Input Fields

Users can customize the input fields of the form.

1. Hover over the input field in the form, you will see the edit button.
2. Click on the edit button, it will open the fields menu in the style panel.

3. In the style panel user can change the background, border, border color, margin bottom, padding, padding top, padding bottom, radius, shadow, shadow opacity, shadow inset & text (font, size, color).

Background: –

• Users can easily change the background color of the input field, to change the color click on the background color.
• Select your desired color from the color palette.
• Click on the publish button to save the changes.

Border: –

• To change the border width of the input field, hover over the borderin the styles window, slider will appear in front of you.
• Adjust the slider to change the width of the border, click on the publishbutton to save the changes.

Border Color: –

• To change the border color of the input field, click on the border color option.
• Select your desired color from the color palette, click on the publish button to save the changes.

Margin Bottom: –

• To change the bottom margin of the input field, hover over the margin bottomin the styles window, slider will appear in front of you.
• You can adjust the slider by increasing or decreasing the bottom margin of the input field, click on the publish button to save the changes.

Padding: –

• To change the horizontal padding of the input field, hover over the paddingin the styles window you will see the slider in front of you.
• You can increase or decrease the horizontal padding by adjusting the slider, click on the publish button to save the changes.

Padding Top: –

• To change the top padding of the input field, hover over the padding top in the styles window you will see the slider in front of you.
• You can increase or decrease the top padding by adjusting the slider, click on the publish button to save the changes.

Padding Bottom: –

• To change the bottom padding of the input field, hover over the padding bottomin the styles window slider will appear in front of you.
• You can increase or decrease the bottom padding by adjusting the slider, click on the publish button to save the changes

Radius: –

• To change the corner radius of the input field, hover over the radiusin the styles window slider will appear in front of you.
• You can increase or decrease the corner radius of the input field by adjusting the slider, click on the publish button to save the changes.
• Click on to reset the radius.

Shadow: –

• To change the shadow width of the input field, hover over the shadowin the styles window and you will see the slider in front of you.
• You can increase or decrease the shadow width of the input field by adjusting the slider, click on the publish button to save the changes.
• Click on button to reset the shadow.

Shadow Opacity: –

• To change the opacity of the shadow of the input field, hover over the shadowopacityin the styles window and you will see the slider in front of you.
• Adjust the slider to increase/decrease the shadow opacity of the input field.
• Click on button to reset the shadow opacity.

Shadow Inset: –

• Shadow Inset allows the user to set the shadow inside or outside of the input field.
• Click on the shadow inset toggle button.
• Toggle on will set the shadow inside the input field.
• Toggle off will set the shadow outside the input field.
• Click on the publish button to save the changes.

Font: –

• To change the font style of the input field, click on the font & select your desired font style from the menu.
• Click on the publishbutton to save the changes.

Size: –

• To change the font size of the input field, hover over the sizein the styles window and you will see the slider in front of you.
• Adjust the slider to change the size of the font.
• Click on the publishbutton to save the changes.
• Click on button to reset the size of the font.

Color: –

• To change the font color of the input field, click on the color.
• The color palette will open, select your desired color.
• Click on the publish button to save the changes.