githubEdit

Borders

Border settings in Theme settings > Borders control corner radius and border width for buttons, form inputs, and other page elements across the storefront.

How to change theme borders

1

Adjust radius

  • Open Theme settings > Borders.

  • Under Radius, set Button radius, Input radius, and Element radius.

2

Adjust width

  • Under Width, set Button width, Input width, and Element width.

3

Preview the storefront

  • Open key templates such as home, collection, product, and cart.

  • Check buttons, fields, and cards on desktop and mobile before publishing.

Notes on borders

  • Button and Input settings apply to those components; Element applies more broadly to other bordered surfaces.

  • A width of 0 removes the visible border for that category where the theme uses these values.

  • Input outline shape also works with Border position under Theme settings > Inputs (full border vs bottom edge only).

Border settings

Radius

Setting
What it controls

Button radius

Corner radius for buttons (0–50 px, default 50 px).

Input radius

Corner radius for form inputs (0–50 px, default 50 px).

Element radius

Corner radius for general page elements (0–50 px, default 5 px).

Width

Setting
What it controls

Button width

Border thickness for buttons (0–5 px, default 1 px).

Input width

Border thickness for inputs (0–5 px, default 1 px).

Element width

Border thickness for general page elements (0–5 px, default 1 px).

Last updated

Was this helpful?