Apply a Gradient Color to Your Content Containers

Apply a Gradient Color to Your Content Containers

Adding a gradient color to your content containers can instantly make your website more visually appealing and dynamic. You can apply gradients to text boxes, behind images, or even simple lists.

ezgif.com-video-to-gif.gif

Steps to Apply a Gradient to Your Container

Follow these steps to give your content containers a gradient background:

  1. Click on the Design tool in the gray navigation bar.

  2. Locate the content block you want to change the background for within the preview window. This could be an Image Block, a Text Block, or any other content container.

  3. Click directly on the content block to open the design menu options on the right-hand side of the preview.

  4. Open the dropdown menu titled Container.

    Screen_Shot_2019-02-26_at_12.30.55_PM.png

  5. Under Fill Type, select the Gradient option.

    Screen_Shot_2019-02-26_at_12.32.42_PM.png

  6. Use the options that appear to set the angle of the gradient and choose the colors you want to include in your gradient.

  7. If needed, you can also adjust the opacity of the colors directly within the color picker.

    Screen_Shot_2019-02-26_at_12.38.57_PM.png

  8. Once you're satisfied with your gradient, click the Save button to ensure your changes are stored, and then Publish to make them live on your website.