Change font size in table - Dawn theme

Topic summary

Goal: Increase the table text size in the Shopify Dawn theme, where table font appears smaller than other text.

Key guidance:

  • Edit theme CSS: Use Online store > Themes > (More) Edit code. Locate the relevant CSS and adjust the table’s font-size.
  • General approach: Identify the table’s HTML class and add a font-size declaration (e.g., font-size: 1.2em).
  • Concrete solution: In base.css, add at the end:
    table { font-size: 1.4rem !important; }
    This forces larger table text and overrides theme defaults.

Notes:

  • CSS (Cascading Style Sheets) controls styling; units like em (relative to parent) and rem (relative to root) scale text responsively. Using !important ensures the rule wins over existing styles.
  • A store URL was requested for more tailored help.
  • The provided code snippet is central to applying the fix.

Status: No confirmation from the original poster; solution appears actionable but outcome unverified. Discussion remains open.

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

Hi,

How do I change the font size in a table under the Dawn theme? It is currently smaller than the other fonts

1 Like

Hi @a-maise ,

Here are my instructions, but they require a bit of HTML and CSS knowledge :slightly_smiling_face:

I believe, that you should be able to change the font size, by editing the CSS of the theme. First I would advise you to find the HTML class of the “table”. Once you have the class, you should be able to edit the font by going to: Shopify > Themes > click on the three dots next to the “Customize button” > click “Edit code”. Then you would need to simply find the “Assets” folder, search for the class and add the correct font to the class, by typing something like “font-size: 1.2 em;”

Hi @a-maise

Would you mind to share your store URL? Thanks!

Hi @a-maise ,

You can follow these steps

Step 1: Go to Online store > Themes > Edit code and find base.css file

Step 2: Insert below code at the end file and Save them

table {
  font-size: 1.4rem !important;
}