Skip to main content
Button and input settings control the appearance of all buttons, form inputs, and interactive elements throughout your store. Once you configure these settings, they apply consistently to add-to-cart buttons, form submissions, newsletter signups, and other interactive elements without needing section-by-section adjustments.

​
What these settings control

  • Button typography (font family, weight, size, letter spacing)
  • Button corner radius (roundness)
  • Button icon styles and positioning
  • Visual consistency across all buttons and inputs
  • Form input field appearance

​
How to access

1

Open the Theme Customizer

From your Shopify admin, go to Online Store → Themes → Customize.
2

Navigate to button settings

In the theme editor sidebar, select Theme settings → Buttons and inputs.
3

Adjust settings

Modify typography, corner radius, and icon options as needed.
4

Save changes

Click Save to apply changes to all buttons and inputs across your store.

​
Settings

​
Button typography

Controls text appearance within all buttons throughout your store.Font family: Select the font used for button text. Available options depend on fonts configured in Typography settings.Font weight: Choose text weight for button labels (300-700). We recommend at least 500 (Medium) for readability.Font size: Adjust button text size in rem units. Typical range is 0.875rem to 1.25rem. Minimum recommended size is 1rem (16px) for accessibility.Letter spacing: Control spacing between letters, measured in em units. Uppercase text often benefits from increased letter spacing (0.05-0.1em).
We recommend using your heading font for buttons to create visual emphasis and distinguish interactive elements.

​
Best practices

  • Use at least 500 font weight and 1rem (16px) minimum font size for readability
  • Match button corner radius with cards and inputs for design consistency
  • Ensure minimum 4.5:1 contrast ratio between button text and background
  • Test buttons on mobile devices to verify touch target sizes (minimum 44x44px)
  • Add 0.05-0.1em letter spacing when using uppercase button text
  • Use heading font for buttons to create visual emphasis
These typography settings only affect text appearance and shape. Button colors are controlled separately in the Colors settings.
  • Colors - Configure button background and text colors
  • Typography - Manage font families used in buttons
  • Cards - Coordinate corner radius with card elements
  • Products - Configure add-to-cart and quick-add button behaviors