Violet Hour CSS Gradient
A violet, dark, elegant linear gradient you can drop into any project. Copy the CSS below and use it as a background for hero sections, cards, buttons, or full pages.
background-color: oklch(0.193 0.069 300.442);
background-image: linear-gradient(to top, oklch(0.254 0.057 266.709) 0%, oklch(0.404 0.128 298.603) 50%, oklch(0.633 0.199 15.728) 100%);The colors
The colors this gradient blends between. Open any of them for a full breakdown: shades, harmonies, and contrast.
Tags
Related gradients
More gradient tools
Browse the full gallery of CSS gradients, build animated backgrounds, or generate soft multi-color backgrounds with the Mesh Gradient Generator.