# Overriding Theme SCSS

**URL:** <https://discourse.gohugo.io/t/overriding-theme-scss/29379>\
**Category:** support\
**Created:** [November 13, 2020, 6:49am UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379 "2020-11-13T06:49:57Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![diehl](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/diehl/32/13499_2.png) [@diehl](https://discourse.gohugo.io/u/diehl)\
**Post date:** [November 13, 2020, 6:49am UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/1 "2020-11-13T06:49:57Z")

</div>

Hello,

What is the proper way to override a theme’s SCSS? I’m using the Tale theme and I’m looking to override the size definition for the post title. Specifically [this line](https://github.com/EmielH/tale-hugo/blob/master/assets/scss/tale/_post.scss#L18). Could you point me to where I should redefine this? I’m looking to reduce the title size from 4 to 3 rem. I’m a complete SCSS/CSS novice so I’m making this up as I go. 😉

Thanks!

Chris

---

<div class="post-metadata">

**Author:** ![gethugothemes](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/gethugothemes/32/13287_2.png) [@gethugothemes](https://discourse.gohugo.io/u/gethugothemes)\
**Post date:** [November 13, 2020, 7:02am UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/2 "2020-11-13T07:02:45Z")

</div>

You can override any file from your theme by putting a copy of it into your root folder. For instance `/themes/themename/layouts/filename.html` becomes `/layouts/filename.html`. In that copy you can change anything and Hugo will use it to override the theme file.

In your case it would be `/assets/scss/tale/_post.scss` as copy where you can change things.

---

<div class="post-metadata">

**Author:** ![ju52](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/ju52/32/6749_2.png) [@ju52](https://discourse.gohugo.io/u/ju52)\
**Post date:** [November 13, 2020, 9:43am UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/3 "2020-11-13T09:43:48Z")

</div>

but you have to redo it after theme updates.  
Look at \_default/basof.html, where the theme css comes in.  
Add your own css after it to overwrite the theme settings.

---

<div class="post-metadata">

**Author:** ![diehl](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/diehl/32/13499_2.png) [@diehl](https://discourse.gohugo.io/u/diehl)\
**Post date:** [November 13, 2020, 2:51pm UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/4 "2020-11-13T14:51:34Z")

</div>

Perfect. When I initially tried this last night, it did not work. I took a slightly different approach in modifying the SCSS file and it now works. Thank you!

---

<div class="post-metadata">

**Author:** ![diehl](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/diehl/32/13499_2.png) [@diehl](https://discourse.gohugo.io/u/diehl)\
**Post date:** [November 13, 2020, 2:52pm UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/5 "2020-11-13T14:52:34Z")

</div>

Thankfully you don’t have to overwrite the theme SCSS file. That would break the pattern of isolating the changes from the base theme.

---

<div class="post-metadata">

**Author:** ![system](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/system/32/1_2.png) [@system](https://discourse.gohugo.io/u/system)\
**Post date:** [November 15, 2020, 2:52pm UTC](https://discourse.gohugo.io/t/overriding-theme-scss/29379/6 "2020-11-15T14:52:35Z")

</div>

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.