Make cart icon smaller?

Store Design
,

Topic summary

A user seeks help reducing the size of their cart icon on their online store.

Solution provided:

  • Navigate to: Online Store → Theme → Customize → Edit Code → icon-cart.liquid
  • Locate the SVG element with viewBox="0 0 70 70"
  • Adjust the viewBox values to desired size
  • In base.css, add margin styling: .header__icon--cart svg { margin: 12px; }

Follow-up:
The original poster requests clarification on where exactly to paste the CSS code. The helper confirms the margin code should be added to base.css file.

The discussion involves editing both the SVG icon file and CSS styling to achieve the desired cart icon size.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

Anyone know how to make the cart icon smaller please?

url: https://errival.com/

Screenshot 2024-08-01 at 21.04.08.png
Screenshot 2024-08-01 at 21.04.08.png2880×1644 256 KB

2

Hi, @Ryan1998
Please open online store → theme → customize → edit code → icon-cart.liquid
<svg
class=“icon icon-cart”
…
viewBox=“0 0 70 70”
fill=“none”

…

  • base.css
    .header__icon–cart>svg {
    margin: 12px ;
    }

Acme_0-1722545160206.png

You can change size what you want by adjusting above bold values.

3

thanks. Where do I past this to be clear?

4

paste*

5

You should find out cart svg in your code and then paste there.
margin is pasted to base.css.