Title: Opacity for background image
Last modified: July 7, 2019

---

# Opacity for background image

 *  Resolved [carmichaeldb](https://wordpress.org/support/users/carmichaeldb/)
 * (@carmichaeldb)
 * [7 years ago](https://wordpress.org/support/topic/opacity-for-background-image/)
 * Is there anyway to set the opacity to the background image via CSS? I have been
   trying to figure this one out but haven’t been able to get anything to work as
   I need. The images in the background have various colours and can make the text
   harder to read, so I need to add some opacity or some sort of overlay to the 
   background image to make the text easier to read. I can just edit the images 
   themselves but I was hoping to make it more dynamic so if the client decides 
   to change the images they can just replace them without having to edit anything.

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

 *  Plugin Author [simonpedge](https://wordpress.org/support/users/simonpedge/)
 * (@simonpedge)
 * [7 years ago](https://wordpress.org/support/topic/opacity-for-background-image/#post-11713214)
 * Unfortunately, with CSS there is no option to set the opacity of a background
   image. But there may be a possible workaround – see this tutorial:
    [https://scotch.io/tutorials/how-to-change-a-css-background-images-opacity](https://scotch.io/tutorials/how-to-change-a-css-background-images-opacity)
 * So instead of using slide backgrounds, add an image (IMG tag) to the slide content.
 * And then use the following CSS:
 *     ```
       #SLIDER_ID .owl-item img {
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: auto;
          opacity: 0.6;
       }
       ```
   
 * (replace ‘#SLIDER_ID’ with the CSS ID of your slider)
    -  This reply was modified 7 years ago by [simonpedge](https://wordpress.org/support/users/simonpedge/).
    -  This reply was modified 7 years ago by [simonpedge](https://wordpress.org/support/users/simonpedge/).
 *  Plugin Author [simonpedge](https://wordpress.org/support/users/simonpedge/)
 * (@simonpedge)
 * [6 years, 12 months ago](https://wordpress.org/support/topic/opacity-for-background-image/#post-11754319)
 * Hi, am marking this resolved as I have not heard back from you on this.
    I hope
   that the solution I provided helped you out – thank you for using Slide Anything
   😉

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

The topic ‘Opacity for background image’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/slide-anything.svg)
 * [Slide Anything - Responsive Content / HTML Slider and Carousel](https://wordpress.org/plugins/slide-anything/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/slide-anything/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/slide-anything/)
 * [Active Topics](https://wordpress.org/support/plugin/slide-anything/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/slide-anything/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/slide-anything/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)

 * 2 replies
 * 2 participants
 * Last reply from: [simonpedge](https://wordpress.org/support/users/simonpedge/)
 * Last activity: [6 years, 12 months ago](https://wordpress.org/support/topic/opacity-for-background-image/#post-11754319)
 * Status: resolved