🌀 Gradient Generator
linear · radial · conic
gen8x tool
🎛️ Builder
interactive
Linear
Radial
Conic
Angle:
135
°
Shape:
Ellipse
Circle
Position X:
50
%
Position Y:
50
%
Size:
farthest-corner
closest-side
closest-corner
farthest-side
Rotation:
0
°
Center X:
50
%
Center Y:
50
%
🎨 Color stops
+ add stop
Repeating
Blend mode:
normal
multiply
screen
overlay
darken
lighten
color-dodge
🔥 30 presets (popular UI)
📋 Copy CSS
⬇️ Export SVG
👁️ Preview & code
live
gradient
over text
over image
cards ↓
card 1
card 2
card 3
CSS output
auto
background: linear-gradient(135deg, #84cc16, #0f0f0f);