Shopifont

About

About Shopifont

Shopifont is a free, independently-built tool that generates the exact code Shopify merchants need to install custom fonts on Dawn and other OS 2.0 themes — without layout shifts, without uploads, and without paid plans.

Why this site exists

Installing a custom font on a Shopify theme is one of those tasks that's simple in theory and consistently painful in practice. The merchant has the font file, knows roughly which CSS file to edit, and ends up either pasting Stack Overflow snippets that don't match Dawn's OS 2.0 token system, or paying for an app that does what amounts to a string substitution.

Shopifont replaces both options with a single page: type the font name, tick the formats you have, and copy the three blocks Shopify actually expects — an @font-face declaration that uses the Liquid asset_url filter, a settings_schema.json snippet that exposes a Theme Editor toggle, and CSS variable overrides that retarget Dawn's typography roots so the font propagates site-wide without touching core templates. No upload, no signup, no JavaScript dependencies the merchant has to ship.

How the tool is built

Shopifont is a static Next.js site exported to plain HTML and CSS. The generator runs entirely in the browser via string interpolation — there is no server, no database, no API. The optional live preview uses the FontFace API on a blob URL so the font you drop never leaves your machine. The site is open about this on every page because trust is the only reason a developer would paste generated code into a production storefront.

We maintain a typed metadata file for every free Shopify OS 2.0 theme — Dawn, Sense, Refresh, Crave, Origin, Studio, Taste, Spotlight, Colorblock, Craft, Ride, Publisher, and Trade — and generate a dedicated guide for each. The guides cover the theme's default fonts, the exact file path the @font-face block belongs in, and the CSS variable convention that lets a single override block survive theme updates.

How Shopifont stays free

The site is funded by display advertising. We work with Mediavine so that ad density stays inside the bounds Mediavine sets for its partners — that means no interstitials, no auto-playing video with sound, and reserved-height ad slots so a loading ad cannot cause the page to jump while you're reading. If display advertising ever conflicts with the developer-tool experience, the experience wins.

We take no affiliate commission for any Shopify theme, app, or service mentioned on the site. The theme metadata is sourced directly from Shopify's public Theme Store and from each theme's own documentation.

Privacy and data

Shopifont uses two analytics tools. Plausible Analytics, when enabled, is cookie-free and reports only aggregate page views and country — no individual tracking. Microsoft Clarity is also loaded to capture heatmaps and session recordings so we can see where the tool is hard to use; Clarity sets first-party cookies and masks sensitive form fields by default. Clarity never has access to the contents of any font file you load locally — the preview reads the file in your browser's memory only, and there is no upload endpoint for it to intercept.

The optional file-preview feature loads your font in your browser only — there is no upload endpoint and no telemetry attached to the file itself. Display advertising, when active, is served by Mediavine and follows Mediavine's own privacy controls; users in regulated jurisdictions see Mediavine's consent flow before personalized ads load.

Who maintains Shopifont

Shopifont is built and maintained by an independent developer who works with Shopify themes day-to-day. The generators on this site are pure client-side string interpolation — what you copy is what runs in your browser, with no server round-trip and no obfuscation. If a theme update breaks the generated code or something looks off, email hello@shopifont.app and you'll get a real reply.

Contact

Questions, theme-specific bug reports, or requests for additional generators are welcome at hello@shopifont.app. If a theme update breaks the generated code, that's the email to send — correctness regressions are priority work.

Shopifont is not affiliated with Shopify Inc. "Shopify" and "Dawn" are trademarks of Shopify Inc. and are used here for compatibility reference only.