Easily Apply Color Filters, Effects
And Blend Modules To Any Element
Now you have even more control over the appearance of every element on your page thanks to our new collection of filters, effects and blend modes.
We want to provide designers the tools they need to be creative on the web, and that means giving you the power to make visual adjustments of any kind with the click of the mouse, right from inside your browser. We want people to be able to jump inside of Divi and start their ideation process, to take a blank canvas and mold and massage it into something wonderful. That’s why we are excited to announce a full range of color filters, effects and blend modes for the Divi Builder that can be applied to any image and all Divi modules, rows and sections.
Check Out The New Filters & Effects In Action
The Brand New Filters And Effects
A new options group and a collection of new custom controls have been added to all Divi modules, rows and sections that make it easy to make color adjustments, apply stylistic effects and blend elements together on the page.
The New Filters Interface
All Divi modules, rows and sections now have a new Filters option group complete with a new set of custom controls that allow you to adjust colors, apply effects and designate blending modes for any element on the page. These controls have also been added to all module images.
Adjust Colors & Stylize Your Page
Everything inside of Divi now has Hue, Saturation, Brightness, Contrast, Invert, Blur, Opacity and Sepia controls that allow you to quickly adjust the appearance of any element. These new features are the perfect way for anyone to bring their unique flare to the page, and the collection of controls really lend themselves to experimentation and exploration. Even if you don’t end up using these filters on your completed page, they are a great way to make sweeping adjustments as you explore new possibilities for your design.
Get Creative With Your Images
Every Divi module that contains images now has unique color filter controls for each individual image, which means you can apply color effects to images without affecting the rest of the module. Color filters are especially useful for images, allowing you to apply Instagram-like styles with ease. Now you can take any image and stylize it match your design.
Add Stunning New Effects
In addition to color filters, we have also added Blur and Opacity controls. Now you can create stunning depth-of-field effects that really bring your page to life without needing to open Photoshop or compromise the integrity of your original image. No need to use super-big transparent PNG images that take forever to load.
Create Layered Styles Using Blend Modes
In addition to color filters and effects, you can also apply blend modules to any Divi element. A whole new range of effects can now be accomplished by blending layered elements, such as columns, rows and sections in creative ways. When combined with filters, the possibilities are countless.
Coming Soon: Custom Hover State Designs
The filters themselves are not the whole story, and one of the main reasons that we are adding these new options is in preparation for an amazing upcoming Dvi feature that will allow you to customize the hover state of every single design options in the Divi Builder, giving you the ability to create stunning color transformations and effect transitions on hover. It’s an extremely useful update made all the more powerful by filters, and it’s something you can look forward too very soon.
10 Stunning Examples Of
Filters, Effects & Blend Modes
There are all kinds of new effects that can be accomplished using these new options. Just take a look at some of the amazing designs our team was able to create!
The new color filters, effects and blend modes are available today, so download Divi and take them for a spin. Let us know what you think in the comments and don’t forget to check back next week for even more great Divi features coming your way.
Get 10% Off Today!
Today's The Best Day To Get Divi Or Upgrade Your Account To Lifetime
Join the most enthusiastic and loving WordPress theme community on the web and download Divi today. Using the new Visual Builder, you can build websites faster than ever before with its incredibly fast and intuitive visual interface. You have to see it to believe it!
Join Today For 10% OFF!Renew Your Account Today For 10% OFF!Upgrade Your Account Today For 10% OFF!
Awesome design sense.
Love Divi 🙂
I don’t know if I’m doing something wrong but when I use a “blend mode” (like “screen” or “multiply”) DIVI add a “et_pb_css_mix_blend_mode_passthrough” class to the image’s column. And — of course — the properties for that class are :
So even if DIVI is setting correctly the mix-blend-mode “screen” to my “.et_pb_image_1” it doesn’t work because I have also to set :
mix-blend-mode: screen !important;
The problem is on pages where I want to use multiple blend modes (“screen” on one image and
“multiply” on an other for example)… And in each case If I just want the effect on my image an not my text in the same colum next to it…
Exemple here : http://manila.laugau.com/home/
Can someone tell me what’s i’m doing wrong ? Or if you have the same problem ?
Thanks a lot ! 🙂
How about new header design options…especially for mobile?
This looks great – thanks for your work!
Thank you Nick and team! You guys ROCK!
You guys continuously blow my mind with awesome updates! Well done, again!
I love how you are always improving but like so many here i am asking for the basics to be looked at.
1. Menu – still have no custom hover over colour, no real customisation.
2. Blurb module – No button option, you have to try to build layouts with a blurb and a button underneath. This gets messy because of my next point.
3. If you have a row with blurbs in it and you press the keep all columns equal, it doesnt work, every single site i build i have to use custom css and its only one line …….
4 Forms – No file upload so I still have to use Gravityforms for all my clients needing anything uploaded.
I apologise if any of these have been fixed at the time of me writing this I have not see it.
Would it not be good to run a poll every week giving customers the change to prioritise what fixes they would most like?
Nice work guys, really loved it,
when can we expect upcoming hover effects
I like the idea. Just Divi? not the divibuilder? its not available in Extra?
This is a very nice update, and I like to see all the suggestions that people are putting forth for future upgrades or enhancements. I especially agree with the responsive image suggestions.
One thing that I would love to see, and something that I’ve struggled with on every Divi site I build is the lack of ability to define custom breakpoints for font sizes, padding, margins, etc. Currently we have three options to choose from to customize our text for screen sizes; Desktop, Tablet and Mobile. However, these sizes don’t always work correctly for us. For example, what looks good on a full size desktop looks terrible on a Desktop view starting around 1300 px until it hits the tablet view where you can define a different text size. This is especially true when you have 3-4 different size columns set up going across the screen. The text runs down as the columns get smaller but it doesn’t reduce in size until it hits the tablet breakpoint, and it just looks terrible. I know you can fix this with CSS media queries, but boy, this is a LOT of work, and for someone who isn’t very CSS savy, it is very daunting to figure out. It would be so nice to be able to easily set font sizes and spacing for text, blurb, etc. modules at a desired screen size break point, especially for smaller desktop views. Your wonderful development team has done so much with all the fancy color editing, animation, etc., it seems like the breakpoint issue is something that is very basic and should have been addressed a long time ago as it pretty much affects each and every user of your theme. Thanks!
ET never seizes to amaze me… Thank you for this feature! 😀
Honestly i am more excited about upcoming hover effects/transitions! But awesome job again Divi Team!