Skip to content

Global Theme Settings - Buttons ​


The Button settings in the Momentum theme control how buttons look across your entire store. Buttons are key conversion elements (Add to Cart, Buy Now, call-to-action links), so a clear, consistent and on-brand design improves both user experience and engagement.

You can set the color, shape, size and border of the primary and secondary button, and define separate hover colors for both.

Where To Find It ​

  1. In your Shopify admin, go to Online Store → Themes.
  2. Click Edit theme on your Momentum theme.
  3. Open Theme settings (gear icon) and select Button.

Settings ​

Primary button ​

  • Border color: outline color of the button.
  • Button border size: thickness of the border (0–10). Use a small value for a subtle look.
  • Button corner radius: how rounded the corners are (0–50). Low values give sharp edges, high values give pill-shaped buttons.
  • Button text size (desktop) / Button text size (mobile): font size of the button label.
  • Button background: main fill color. Usually your brand's primary or accent color.
  • Button text color: color of the label. Make sure it contrasts well with the background.
  • Button height: height of the button (30–80 px).
  • Button horizontal padding: space left and right of the label (10–40 px).

Primary button hover ​

  • Hover background color: background when the mouse is over the button.
  • Hover text color: text color on hover.
  • Hover border color: border color on hover.

Leave these fields empty to keep the previous behaviour: on hover, background and text color swap (the button "inverts"). As soon as you set a color, it replaces the swap for that property only. For example, you can set just a darker hover background and leave the text color as it is.

Secondary button ​

  • Secondary button border color, Secondary button border size, Secondary button corner radius
  • Secondary button text size (desktop) / (mobile)
  • Secondary button background and Secondary button text color

Secondary button hover ​

  • Hover background color, Hover text color, Hover border color: same logic as for the primary button. Empty fields keep the previous swap effect.

Tips ​

  • Test the hover state on a real page: it should be clearly visible but not jarring. A slightly darker or lighter version of the button color often works better than a full color swap.
  • Check contrast for both states (normal and hover). Text must stay readable.
  • Sections with their own button style option (e.g. "Global / Custom") use these global values whenever Global is selected.
  • Click Save to apply your changes.

Momentum Theme – Help Center