Are you looking to personalize your Shopify store’s design with custom CSS? Whether you want to change fonts, colors, or layout styles, adding your own CSS file gives you full control over your store’s appearance. In this tutorial, I’ll walk you through the exact steps to add custom CSS in Shopify.

Step 1: Open Your Shopify Store

Start by logging into your Shopify admin dashboard.

Step 2: Access the Code Editor

1. Go to Online Store > Themes.
2. Click on the Customize dropdown of your current theme.
3. Select Edit code.

Step 3: Create a New CSS File

1. In the Assets folder, click on Add a new asset.
2. Choose Create a blank file.
3. Name your file something like custom.css and click Add asset.
4. Paste your custom CSS code into this file. For example:

5. Click Save.

Step 4: Link Your Custom CSS in theme.liquid

1. In the Layout folder, open the theme.liquid file.
2. Scroll and find the </head> tag.
3. Just above it, insert the following code:

4. Click Save.

📝 Shopify uses its own Liquid templating language. The code above is the correct way to include your CSS file in the theme.

Step 5: Preview Your Store

Now, visit your website and refresh the page. Your custom styles should be applied. For example, if you changed the text color to red, it should reflect on the site immediately.

🎉 Conclusion

By following these steps, you’ve successfully added a custom CSS file to your Shopify theme. This gives you the flexibility to fine-tune your store’s look and feel beyond the built-in settings.

💡 Pro Tip: Keep your custom styles in a separate file (like custom.css) instead of modifying existing theme files. This makes updates easier and prevents breaking changes.