Forms

Usage

Open Appearance → Customize → Styles → Forms to style text fields, dropdowns, and text areas across the site. Set the field Font and padding, then Input Height, Border Width, Border Radius, Border Color, and Border Color On Focus so fields match your buttons.

The Label settings style field names. The Sublabel settings do the same for the helper text under fields. Colors come from Styles → Palette.

When to use it

• Contact or checkout forms look out of place next to your buttons. Match Border Radius with Styles → Buttons.
• Labels or hints are hard to read against your background.
• Before launch, to give Gravity Forms and WooCommerce checkout a consistent look.

Tips

• Border Color On Focus defaults to Primary, so the field a visitor is typing in shows your brand color.
• Label Weight and Sublabel Color (default Muted) set field names apart from helper text.
• Label Transform and Sublabel Transform set uppercase or capitalization separately for field names and helper text.
• Submit buttons use Styles → Buttons, not these settings.
• Success and error messages use the palette Success and Failure colors. Adjust them under Styles → Palette.