Layout
Page width, corner radii and how cards are drawn across the theme.
What it controls
Page width is the maximum width of the content column. Sections with Width → Fixed width stop at this width; sections with Full width run to the edge of the screen.
The Corner radius group sets the roundness of buttons, inputs, cards, content blocks and badges, each on its own. Section cards decides how the cards inside sections are drawn: with a soft shadow, with a border, or flat on the surface. This affects the buy box, the guarantee card, the contact form card, the FAQ rows in card style and similar surfaces. Product cards have their own Card style under Product cards, and menus and popups keep their shadow whatever you choose here.
How it connects
Every section reads page width and the radii through the theme’s CSS variables, so a change here is immediate and global. There are no per section overrides.
Setting it up
- Set Page width to match your typical screenshots and photography. 1440 is a good default.
- Set Buttons and Inputs to the same radius. 0 for a sharp, technical look, 8 for the default, 24 for pills.
- Set Cards and Blocks a little larger than buttons. Set Badges small.
- Choose Section cards. Shadow is the default and suits the paper background.
Settings
| Setting | Type | What it does |
|---|---|---|
| Page width | Range | The widest the content column gets. Sections set to Fixed width stop here; Full width sections run to the edge of the screen.1200 to 1600 px · Default: 1440 |
| Corner radius | ||
| Buttons | Range | Corner roundness of every button. 0 is square, 24 is a pill.0 to 24 px · Default: 8 |
| Inputs | Range | Corner roundness of text fields, selects and the search box. Usually the same as buttons.0 to 24 px · Default: 8 |
| Cards | Range | Corner roundness of product cards and the larger card surfaces such as the buy box.0 to 32 px · Default: 12 |
| Blocks | Range | Corner roundness of content blocks inside sections: tiles, boxes, media, bundle cards.0 to 32 px · Default: 12 |
| Badges | Range | Corner roundness of the small badges over product images.0 to 16 px · Default: 4 |
| Section cards | Select | How the cards inside sections are drawn: with a soft shadow, with a border, or flat on the surface. Product cards have their own style under Product cards.Options: Shadow, Border, Flat · Default: Shadow |
Tips
- Keep the corner radii in proportion. Buttons and inputs the same, cards and blocks the same and larger, badges smallest. Mixed radii make a page look assembled from parts.
- Page width 1440 is the width the demo is designed at. Wider looks generous on large monitors but stretches two column sections; narrower makes the page feel like a magazine.
- Set Section cards to Flat if you use strong color schemes on cards. Shadows on a dark card look muddy.