How can I adjust social media icon size in the Dawn theme?

Technical Q&A
, ,

Topic summary

A user seeks help increasing the size of Facebook and Instagram icons in their Shopify Dawn theme. They’ve attempted previous solutions but struggle with the code implementation.

Proposed Solutions:

Multiple support teams (GemPages, PageFly, and a community member) offer CSS-based fixes:

  • Method 1: Add CSS to theme.css targeting .social-media-links svg with width/height values of 24px-42px
  • Method 2: Target .social-media-links.flex.items-center.px-2 svg with width 32px and height 25px using !important flags

Implementation Steps:

  1. Navigate to Online Store → Theme → Edit code
  2. Open Asset → theme.css file
  3. Paste provided CSS code at the bottom of the file

The user shared their store URL (crazyforcake.com.au) to enable personalized assistance. Support teams included screenshots demonstrating the code placement locations. The discussion remains open pending confirmation of which solution worked.

Summarized with AI on November 24. AI used: claude-sonnet-4-5-20250929.
6

Hello @timbowes ,

I would like to give you the recommendation to support you so kindly follow the steps below:

  1. Go to Online Store > Theme > Edit code of your current theme

GemPages_0-1671078610518.png
GemPages_0-1671078610518.png1857×907 102 KB

  1. Open your theme.liquid theme file

  2. Paste the below code before

For example,

GemPages_1-1671078769403.png
GemPages_1-1671078769403.png1918×906 75.5 KB

If you require any further information, feel free to contact me.

Best regards,
GemPages Support Team