Shopify CSS subsetting: what changes from April 20, 2026

What Shopify's automatic CSS subsetting is

Starting April 20, 2026, Shopify will change the way it delivers stylesheets in Liquid themes. Through the automatic CSS subsetting mechanism, the platform will analyze which sections, blocks, and snippets are actually rendered on each page and deliver to the browser only the CSS rules associated with those elements.

Until now, every {% stylesheet %} tag present in a theme was included in full on every page load, regardless of whether the classes defined within it were actually used in that specific view. With the new behavior, rules that aren't relevant to the current page will simply be omitted.

This isn't a bug fix: it's a deliberate architectural decision by Shopify, documented in the platform's official changelog.

Why it's a visual regression risk, not just a performance one

The critical point here isn't about site performance. The real risk is that CSS that works correctly in development stops being delivered in production, causing visual regressions that are hard to diagnose.

The problem shows up in a specific scenario: a section defines CSS classes within its own {% stylesheet %}, but those classes are applied to elements generated by completely separate files, not connected to the section via {% render %}.

In this case, if the section that "owns" the stylesheet isn't rendered on a given page, the CSS rules it contains won't reach the browser. The result is a broken layout or unstyled elements, visible only in production and often only on specific combinations of template and content.

Which themes are at risk

Not all themes are equally exposed. Themes with a clean, well-separated architecture, where each Liquid file manages its own styles independently, won't be affected at all.

The themes at greatest risk are:

• Custom themes developed over time with CSS logic distributed in an unsystematic way
• Forks of third-party themes modified to add functionality without respecting the original structure
• Shopify Plus themes with advanced sections that share classes between unrelated components
• Any theme where a section's CSS classes are reused in snippets or global layouts without an explicit dependency via {% render %}

How to audit your themes before April 20

The audit needs to be conducted page by page, not just through a static review of the source code. Here are the checks to run.

Check the consistency of your stylesheets

For every {% stylesheet %} tag in the theme, you need to answer this question: are the classes defined in this block applied exclusively to elements generated by the same file or its direct children via {% render %}?

If the answer is no, that CSS rule is potentially at risk of not being delivered on some pages.

Identify classes shared between unrelated files

An effective audit involves mapping all CSS classes defined in the {% stylesheet %} tags and cross-referencing them with the Liquid files that use them. Any class present in multiple files that aren't connected by a direct {% render %} relationship represents a critical point.

Test in staging, not in production

Testing should be carried out in a staging environment that mirrors the production configuration, including:

• All page types: home, PDP, PLP, cart, checkout, CMS pages
• Template variants with different content
• Sections active and inactive across different pages

Testing only after April 20 means handling a live emergency with customers already impacted.

Priorities for those managing multiple merchants

Anyone managing a portfolio of merchants on Shopify Plus needs to consider that each store may have a theme with a different configuration. The audit can't be centralized on a single theme: it needs to be replicated store by store, paying attention to customizations applied over time.

If you want an estimate of the effort needed to secure your themes, check out our Shopify developer plans to understand how to structure the work.

What to do right now

Concrete actions to start today:

• Inventory all {% stylesheet %} tags present in active themes
• For each one, verify that it only styles elements from its own file or direct children
• Identify any class shared between unrelated files and refactor it
• Set up an up-to-date staging environment and test all page types
• Document the changes to prevent the issue from resurfacing with future development

A technical check carried out now takes hours. The same check carried out after a production regression can take days, with direct costs to the merchant in terms of lost sales and urgent interventions.