Colors
Search
⌘K
Back
Log in
Theme
Auto
Light
Dark
CSS Gradient Generator
CSS gradient docs ↗
Gradient
Type
Linear
Radial
Conic
Angle (deg)
Position X (%)
Position Y (%)
Shape
Ellipse
Circle
Size
closest-side
closest-corner
farthest-side
farthest-corner
Blur (px)
Opacity (%)
Color Stops
+ Add Stop
Presets
Preview
Tip: Drag X/Y to move the gradient center.
CSS Output
Classes (comma-separated)
IDs / Elements (comma-separated)
Tip:
Classes
→ bare words become
.class
(e.g.
main
→
.main
).
IDs/Elements
→ bare words become
#id
unless it’s a known tag like
h1
,
p
,
main
. Commas allowed; everything is combined into one rule.
Copy CSS
Colors
4370 Chicago Dr. SW #522
Grandville, MI 49418
United States
Customer service
Terms and conditions
Copyright © 2025 DirectoryToolkit
___MESSAGE___
___MESSAGE___