Title: reduce opacity header
Last modified: December 4, 2021

---

# reduce opacity header

 *  Resolved [andyms](https://wordpress.org/support/users/andyms/)
 * (@andyms)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/)
 * hi, may I know if any nice people here are willing to help me for reducing opacity
   at the header (the black one) when it scrolls down below.
 * many thanks
 * andy

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Theme Author [WPZOOM](https://wordpress.org/support/users/wpzoom/)
 * (@wpzoom)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15131596)
 * Hello [@andyms](https://wordpress.org/support/users/andyms/)
 * You can change it using this CSS code:
 *     ```
       @media screen and (min-width: 48em) {
           .has-header-image.home.blog .headroom--not-top .navbar, .has-header-image.inspiro-front-page .headroom--not-top .navbar, .has-header-video.home.blog .headroom--not-top .navbar, .has-header-video.inspiro-front-page .headroom--not-top .navbar {
               background: rgba(0,0,0,.9);
           }
       }
       ```
   
 * Just add it in the Customizer > Additional CSS, then change “.9” to a lower value.
 *  Thread Starter [andyms](https://wordpress.org/support/users/andyms/)
 * (@andyms)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15132118)
 * Thank you !
 *  Thread Starter [andyms](https://wordpress.org/support/users/andyms/)
 * (@andyms)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15132124)
 * hi [@wpzoom](https://wordpress.org/support/users/wpzoom/)
 * It only affects the home page, other pages don’t affect it, please advise.
 * thanks
 *  [Ina](https://wordpress.org/support/users/inamoro/)
 * (@inamoro)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15136307)
 * [@andyms](https://wordpress.org/support/users/andyms/) can you send us the link
   to your website?
 *  [Ina](https://wordpress.org/support/users/inamoro/)
 * (@inamoro)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15136356)
 * [@andyms](https://wordpress.org/support/users/andyms/) replace the previous code
   with this one and it should work:
 *     ```
       @media screen and (min-width: 48em) {
           .page-template-default .headroom--not-top .navbar, .has-header-image.home.blog .headroom--not-top .navbar, .has-header-image.inspiro-front-page .headroom--not-top .navbar, .has-header-video.home.blog .headroom--not-top .navbar, .has-header-video.inspiro-front-page .headroom--not-top .navbar {
               background: rgba(0,0,0,.6);
           }
       }
       ```
   
 *  Thread Starter [andyms](https://wordpress.org/support/users/andyms/)
 * (@andyms)
 * [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15136393)
 * wow, many thanks [@inamoro](https://wordpress.org/support/users/inamoro/)
 * what a great support team here, love it !

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘reduce opacity header’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/inspiro/2.2.0/screenshot.png)
 * Inspiro
 * [Support Threads](https://wordpress.org/support/theme/inspiro/)
 * [Active Topics](https://wordpress.org/support/theme/inspiro/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/inspiro/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/inspiro/reviews/)

 * 6 replies
 * 3 participants
 * Last reply from: [andyms](https://wordpress.org/support/users/andyms/)
 * Last activity: [4 years, 6 months ago](https://wordpress.org/support/topic/reduce-opacity-header/#post-15136393)
 * Status: resolved