Build CSS gradients visually — linear, radial, or conic. Add color stops, set angles and positions, then copy the ready-to-use CSS gradient instantly.
CSS gradients are generated images — they can be used anywhere an image is accepted, including background, mask, and border-image. A linear-gradient takes an angle (in degrees or a keyword like to right) followed by color stops. Radial gradients radiate from a center point with a configurable shape (circle or ellipse). Conic gradients rotate around a center point and are ideal for pie charts and color wheels. Each color stop can have an explicit position in %, px, or em — omitting positions distributes stops evenly. Stacking multiple gradient layers with transparency creates complex multi-directional effects with a single property.