How can I modify the font and size of my ATC button?

Topic summary

Modifying the ATC (Add to Cart) button’s font size and font family while keeping its dimensions unchanged.

  • Initial solution: A contributor provided CSS for Shopify’s Theme Customizer targeting product-form submit spans to increase font size (with !important). Screenshots illustrated where to add the code and the visual result.

  • Context: The store uses GemPages for the homepage, which can override theme styles. The user asked about applying changes on product pages and later confirmed the font size issue was resolved.

  • Changing the font family: The user requested how to change the ATC button’s font. GemPages support advised doing it directly in the GemPages editor: select the element, open Typography/Font settings in the left sidebar, choose a font, and adjust size/weight/style, then save.

  • Key terms: ATC = Add to Cart; GemPages = a Shopify page builder; Theme Customizer = Shopify’s theme settings/preview editor.

  • Outcome: Font size resolved; clear steps provided to change font via GemPages. No further open questions were recorded.

Summarized with AI on December 26. AI used: gpt-5.

Hi, thank you for your reply. It still doesn’t seem to work maybe because for my home page I am using gem pages, can we add this code on to product pages directly?