Shopify Google Fonts Snippet
Paste-ready Liquid + CSS for any Shopify Online Store 2.0 theme.
Runs entirely in your browser — no upload, no registration.
theme.liquid
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap">base.css
:root { --font-heading: 'Poppins', sans-serif; --font-body: 'Poppins', sans-serif; }
h1,h2,h3,h4 { font-family: var(--font-heading); }
body { font-family: var(--font-body); }What this tool does
Generates a <link> for theme.liquid and CSS variables for your theme's stylesheet.
Why you might need it
Skip the paid font apps — this is what they generate under the hood.
How to use it
- Add the Liquid before </head>.
- Add the CSS to base.css or theme.css.
Always review the included licence before commercial use. Do not remove copyright records, designer names, licensing metadata or embedding restrictions from any font you process.