Background Editor Studio

Background Editor Studio

CSS Gradient + Background Image Designer

Gradient & Presets

Gradient Type Linear Radial Conic None — Image Only

Angle / Direction

135^

Presets

Gradient Stops

Image + Image Effects + Overlay + Vignette

Online Image URL

Paste an online image URL.

Image Size Cover Contain Auto Stretch Repeat No Repeat Repeat Repeat X Repeat Y

Position X

50%

Position Y

50%

Image Opacity

100%

Blur

0px

Brightness

100%

Contrast

100%

Saturation

100%

Grayscale

0%

Sepia

0%

Hue Rotate

0^

Overlay Enable Overlay

Inactive / transparent

Normal Multiply Screen Overlay Soft Light Hard Light Color

Vignette Enable Vignette

0%

70% softness

Inactive / transparent

Output

Preview Size

Actions

Generated CSS

CSS Variables

Choose a gradient or paste an image URL to begin.