1. Home
  2. Docs
  3. Lagoon
  4. Pages Elements
  5. Changing Background Color Effect

Changing Background Color Effect

Another background effect we’ve created in Lagoon which we really like is the one you’ll find the Pricing page of our demo, where the background color is constantly changing, adding a “moving” effect.

The change the colors of this effect, simply open the page’s settings and navigate to the Custom CSS section, and place the following code there:

.breathing-bg-blurbs-demo { 
    background: -webkit-linear-gradient(top, #4fda90, #4cbda5, #1bd471, #269b5c);
    background: -o-linear-gradient(top, #4fda90, #4cbda5, #1bd471, #269b5c);
    background: linear-gradient(180deg, #4fda90, #4cbda5, #1bd471, #269b5c);
    background-size: 600% 600%;
}

Note that there are 4 colors currently, you can remove, edit, or change them – just always use HEX coded colors.

Was this article helpful to you? Yes No

How can we help?