Creative / Theme settings / Add rounded corners to elements in your store
OS 2.0 themes
Creative provides corner radius settings that allow you to customize the roundness of various elements on your site. This article will give an explanation of each setting and show you which area of your site it will be applied to.
Corner Radius options
There are 7 elements of the theme where the corner radius can be customized, the settings are disabled on elements where the content stretches the full width of the browser window and where rounded corners are otherwise inappropriate.
Here are the steps for setting corner radius parameters along with details of each option:
Click the Customize button in the Themes area of your Shopify admin. This will take you to the theme editor.
Click on the Theme settings button in the theme editor's left sidebar.
Click on the Corner Radius dropdown option in the theme settings menu.
- This area contains a number of settings with sliders that can be used to increase or reduce the amount of corner radius applied :
- Buttons - Applies radius to all buttons on the theme.
- Form elements - Applies radius to any element that receives text input such as newsletter sign-ups or contact forms.
- Variant buttons - Applies radius to variants everywhere they appear on the site.
- Product labels - Applies radius to product labels on the product grid.
- Popups and modals - Applies radius to popups such as newsletter popups and to the Quick Shop modal.
- Content containers - Applies radius to sections that contain multiple content elements such as a heading, button and image.
- Media - Applies radius to standalone style images, including product images on the product page.
To exclude product images from having corner radius applied navigate to the Product page settings and uncheck the Enable corner radius box :
After setting each option, click Save and check your work.