Gradient Background


Follow these steps to create a gradient background visually, without relying on CSS.

Add a Section

  1. Click Add Section
  2. Drag in a Widget
  3. Click the Section Settings handle to enter the Section Settings
  4. Go to Style > Background
  5. Under Background type click the icon to enter the Gradient Settings

Gradient Background Settings

  1. Color: set the first gradient color
  2. Location: set the location of the first color. This will affect the spread
  3. Second color: set the second gradient color
  4. Location: set the location of the second color. This will affect the spread
  5. Type: Choose between a linear or radial gradient
  6. Angle: Set the gradient angle

Share it on social networks

Was this article helpful?

Get Started With Elementor Today

Join millions of professionals who use Elementor to build WordPress websites faster and better than ever before

On this page