Title: Transparent Background
Last modified: June 21, 2017

---

# Transparent Background

 *  Resolved [semperaye](https://wordpress.org/support/users/semperaye/)
 * (@semperaye)
 * [8 years, 12 months ago](https://wordpress.org/support/topic/transparent-background-48/)
 * Hello,
 * I was wondering how I can set the transparency or opacity of the default white
   background of the fancy box when having a transparent png image pop up with the
   easy fancy box. Please see the “Explore” button on test.salamatphilippines.com.
 * Thanx!

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

 *  [Rolf Allard van Hagen](https://wordpress.org/support/users/ravanh/)
 * (@ravanh)
 * [8 years, 12 months ago](https://wordpress.org/support/topic/transparent-background-48/#post-9248589)
 * Hi, try adding these style rules to your custom CSS:
 *     ```
       #fancybox-content, #fancybox-outer {
           background-color: rgba(0,0,0,0);
           border-color: rgba(0,0,0,0);
           box-shadow: none;
       }
       ```
   
 * but be aware that all will show through including texts and header image, making
   it rather confusing for your visitors to know what is is what…
 *  Thread Starter [semperaye](https://wordpress.org/support/users/semperaye/)
 * (@semperaye)
 * [8 years, 11 months ago](https://wordpress.org/support/topic/transparent-background-48/#post-9254441)
 * Wow thanks! Is there anyway to set opacity instead? So that it’s only semi transparent?
 *  [Rolf Allard van Hagen](https://wordpress.org/support/users/ravanh/)
 * (@ravanh)
 * [8 years, 11 months ago](https://wordpress.org/support/topic/transparent-background-48/#post-9257126)
 * yes, change the last zero or the rgba code to a value between 0 (full transparency)
   and 1 (fully opaque). for example 0.4
 * or use an online color tool like [http://www.css3maker.com/css-3-rgba.html](http://www.css3maker.com/css-3-rgba.html)
   to play with and get the perfect rgba value for your needs 🙂
 *  Thread Starter [semperaye](https://wordpress.org/support/users/semperaye/)
 * (@semperaye)
 * [8 years, 11 months ago](https://wordpress.org/support/topic/transparent-background-48/#post-9258966)
 * Here is the code I used sir. Thank you very much! I’m really happy with how it
   turned out 🙂
 * #fancybox-content, #fancybox-outer {
    background-color: rgba(255,255,255,0.6);
   border-color: rgba(0,0,0,0); box-shadow: none; }

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

The topic ‘Transparent Background’ is closed to new replies.

 * ![](https://ps.w.org/easy-fancybox/assets/icon-256x256.png?rev=3188201)
 * [Firelight Lightbox](https://wordpress.org/plugins/easy-fancybox/)
 * [Support Threads](https://wordpress.org/support/plugin/easy-fancybox/)
 * [Active Topics](https://wordpress.org/support/plugin/easy-fancybox/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/easy-fancybox/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/easy-fancybox/reviews/)

## Tags

 * [png](https://wordpress.org/support/topic-tag/png/)
 * [Transparency](https://wordpress.org/support/topic-tag/transparency/)

 * 4 replies
 * 2 participants
 * Last reply from: [semperaye](https://wordpress.org/support/users/semperaye/)
 * Last activity: [8 years, 11 months ago](https://wordpress.org/support/topic/transparent-background-48/#post-9258966)
 * Status: resolved