# Customizing CSS in themes without Sass
Before you customize a theme, make a backup. Refer to Shopify help: Duplicating themes (opens new window).
In the spring of 2020, we started migrating our themes to a new development framework. As part of this transition, we also stopped shipping Sass files with the themes. This article explains how to customize the CSS in these themes.
Currently, it applies to Cascade version 1.3.0 and later and Editorial version 3.6.0 and later.
If you’ve customized earlier versions of the theme you may be used to editing a file named theme.scss.liquid. This file is no longer included.
Instead, you’ll find that the theme uses a new file, theme.min.css.liquid. This is a plain CSS file that is purged of unused styles and is also minified to decrease file size. Using this file is the best option for most merchants as these optimizations result in a slight performance boost.
However, if you’d like to make changes or customizations, you still can. You can either use the included unminified version of the file or add your own CSS file, just for customizations.
# To add your own CSS
If you don’t need to make changes to existing CSS but would simply like to override some of it or add your own CSS, you can continue using the minified file and add your own customizations file to be used alongside it.
# Create a new CSS file
Create a file called
custom.css in the
assets directory. If you plan
to use Liquid in this file, you can name it
# Point to the custom file from the theme
snippets/style-tags.liquid point to your custom CSS by inserting
the following line at the end of the file:
<link rel="stylesheet" href="custom.css">
# Use the unminified CSS file
If you would like to make changes to existing Cascade CSS or would
prefer to add your custom CSS at the end of the existing CSS file, you
can use the included unminified CSS file. This file is located at
To do so, simply change the stylesheet link in
assets/style-tags.liquid, removing the
.min so it reads:
<link href="theme.css" rel="stylesheet">
Note that this file is not minified and also contains some unused styles that may come in handy when customizing the theme, such as the complete set of grid system classes.
# If you have existing SASS or SCSS code
If you have SASS code that you used in previous versions of the theme, you can compile it to plain CSS with a local SASS compiler or with an online tool like SassMeister: