Skip to main content
Corner settings give the storefront its shape language. One choice applies to cards, media frames, tiles and drawers across the theme, and a separate radius shapes inputs and selects. Because these values are reused by every section, you set them once and every new section you add already matches.

​
What these settings control

  • Corner rounding of product, collection and article cards
  • Corner rounding of images, videos and media frames inside sections
  • Corner rounding of boxes such as tiles, panels and drawers
  • The radius of text inputs, selects and search fields
Button corners are set separately in Buttons, so buttons can be pill-shaped while cards stay square, or the other way round.

​
How to access

1

Open the Theme Customizer

From your Shopify admin, go to Online Store, then Themes, and select Customize.
2

Open Theme settings

Select the Theme settings icon at the bottom of the left sidebar.
3

Select Corners

Expand the Corners group to see Corner style and Input corner radius.
Corners group in the Theme settings sidebar

​
Settings

Corner style: The rounding used across cards, media and boxes throughout the theme. Default: Soft.
  • Sharp: No rounding anywhere. Cards, images and tiles have crisp right angles, which suits minimal and luxury aesthetics.
  • Soft: A small, even radius on all four corners. Friendly without drawing attention to itself. Default.
  • Rounded: A larger radius on cards and media, with small controls such as pills becoming fully round. Suits playful and lifestyle brands.
  • Diagonal: Two opposite corners are rounded, the top-left and bottom-right, while the other two stay sharp. This gives cards and media a distinctive leaf-like silhouette that reads as a deliberate brand signature.
Input corner radius: The radius applied to inputs and selects, from 0 to 30 pixels. Default: 4 pixels. It is independent of Corner style, so you can keep form fields slightly rounded while cards are Sharp. The exception is Diagonal: with that corner style, inputs and selects take the same two-corner shape so forms match the rest of the page, and this radius is not used.
Choosing Diagonal changes the silhouette of every card, media frame, tile and input on the store. Preview the home page, a Collection Page (PLP) and the cart before saving.

​
Best practices

  • Align corners with buttons: Pair Sharp with Sharp button corners and Rounded with Fully rounded buttons. Mixed pairings are possible but should be a deliberate choice.
  • Match the input radius to the corner style: Around 4 pixels for Soft, 0 for Sharp and 8 or more for Rounded keeps newsletter forms and search fields consistent with nearby cards.
  • Use Diagonal sparingly: It is a strong visual statement; it works best with plenty of whitespace and simple imagery, and less well with busy product photography.
  • Consider bordered cards: With Show a border on cards enabled, larger radii soften the grid; Sharp corners give a clean, grid-like look.
  • Preview drawers and popups: Corner style also shapes the cart drawer, quick view drawer and popups, which are easy to forget when previewing.