Preview

Gradient Type

Angle: 90°

Color Stops (2/8)

0%
100%

CSS Code

background: #667eea;
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

Background Property Only

background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

Tailwind CSS

bg-gradient-to-r from-[#667eea] to-[#764ba2]

Export

About CSS Gradients

🔀 Linear Gradients

Create smooth color transitions along a straight line. Specify an angle (0-360°) to control the direction of the gradient flow.

⭕ Radial Gradients

Colors radiate outward from a central point. Choose between ellipse or circle shapes and position the center point.

🔄 Conic Gradients

Colors rotate around a center point like a color wheel. Great for pie charts, color pickers, and creative effects.

🎨 Color Stops

Add up to 8 color stops to create complex multi-color gradients. Adjust positions to control color distribution.

Need Custom Web Design?

Let Brix340 create stunning, professional websites with beautiful gradients and modern design. From landing pages to full web applications, we bring your vision to life.

Get Started with Brix340