Can I customize size chart styling?

Yes — Tailor Size Guide exposes CSS variables (--tsg-primary, --tsg-bg, --tsg-text, --tsg-border, --tsg-radius, --tsg-font). Override in your theme's CSS to match brand. Or paste custom CSS in app settings.

Do I need to edit theme.liquid?

No — for Shopify 2.0 themes, override CSS variables via the app block settings panel. Paste a CSS snippet in the field labeled 'Custom CSS' and it auto-injects on every page where the block renders.

By Mohit Patel, Marketing Specialist, Tailor Size Guide

Shopify how-to June 30, 2026 3 min read

How to Style Shopify Size Charts with Custom CSS

Found this guide useful? Share it with someone who needs it.

Add Tailor Size Guide as a preferred source on Google

CSS variables. Match brand. No theme edits.

CSS Variables Available

--tsg-primary button + accent color
--tsg-bg popup background
--tsg-text primary text color
--tsg-border table + popup border
--tsg-radius border radius (default 12px)
--tsg-font font family (defaults to theme inherit)

Where to Paste

App settings → Appearance → Custom CSS field. Paste your overrides. Saves immediately.

FAQs

Customize styling?

CSS variables.

Theme edits required?

No.

Brand-perfect size charts

Tailor Size Guide ships with simple CSS variables.

Install the Shopify app Read the docs