Multipurpose theme documentation
Multipurpose Fashion Theme
Theme Settings Design
Multipurpose Fashion Theme
The Design settings control the structural appearance of your UI components, especially buttons and icons. These settings define your store's visual personality.
Shopify Admin → Online Store → Themes → Customize → Theme settings → Design
General Settings
1. Edges (design_edges)
Controls the default corner style across components like buttons, cards, inputs, and tags.
- Square → Sharp 90° corners
- Round → Soft rounded corners
Use square for modern minimal brands. Use round for lifestyle or fashion themes.
Button Style
2. Button Style (button_style)
Defines base curvature preset:
- Sharp
- Slightly round
- Round
This is a preset before border radius customization.
Button Appearance
3. Border Radius (button_border_radius)
Controls how rounded the button corners are. Measured in pixels. Higher value = more rounded.
4. Padding Vertical (button_padding_vertical)
Controls top and bottom spacing inside button. Affects button height.
5. Padding Horizontal (button_padding_horizontal)
Controls left and right spacing inside button. Affects button width.
6. Background Color (button_background)
Defines button fill color. Overrides default scheme if specified.
7. Text Color (button_color)
Defines text color inside buttons. Must contrast strongly with background.
8. Font Size (button_font_size)
Controls button text size. Measured in pixels.
9. Font Family (button_font)
Selects typography for button labels. Should match brand identity.
Icons
10. Cart Icon (icon_cart)
Choose the icon symbol shown in header and cart. Options:
- Cart
- Bag
- Basket
11. Icon Weight (icon_weight)
Controls stroke thickness:
- Extra light
- Light
- Regular
- Semi bold
- Bold
- Extra bold
12. Icon Edges (icon_edges)
Controls icon corner style: Sharp or Rounded.
Icons should visually match your button style and overall brand tone.
Common Mistakes
| Problem | Cause | Solution |
|---|---|---|
| Buttons too large | Excessive padding values | Reduce vertical padding |
| Button text unreadable | Low contrast between background and text | Adjust button_color |
| Icons too heavy visually | Icon weight set to bold | Use regular or light |
| Design inconsistency | Mixed square and round settings | Use consistent edge style |
FAQs
Edges control whether UI elements appear square or rounded.
Button style is a preset design look. Border radius manually controls the rounding of button corners.
Padding controls the internal spacing inside buttons, affecting size and appearance.
Icon weight adjusts thickness, from extra-light to extra-bold.