uiGradients has an amazing collection of ready-to-use CSS gradients for pretty much anything. I highly recommend checking out the full collection. Meantime, here are our top picks in case you’re looking for some color:
.stripe {
background: linear-gradient(to right, #1fa2ff, #12d8fa, #a6ffcb);
}.flare {
background: linear-gradient(to right, #f12711, #f5af19);
}.vanusa {
background: linear-gradient(to right, #da4453, #89216b);
}.sublime-light {
background: linear-gradient(to right, #fc5c7d, #6a82fb);
}.bighead {
background: linear-gradient(to right, #c94b4b, #4b134f);
}.velvet-sun {
background: linear-gradient(to right, #e1eec3, #f05053);
}.argon {
background: linear-gradient(to right, #03001e, #7303c0, #ec38bc, #fdeff9);
}.celestial {
background: linear-gradient(to right, #c33764, #1d2671);
}.relay {
background: linear-gradient(to right, #3a1c71, #d76d77, #ffaf7b);
}.crystal-clear {
background: linear-gradient(to right, #159957, #155799);
}.ibiza-sunset {
background: linear-gradient(to right, #ee0979, #ff6a00);
}.fresh-turboscent {
background: linear-gradient(to right, #f1f2b5, #135058);
}.cheer-up-emo-kid {
background: linear-gradient(to right, #556270, #ff6b6b);
}.starfall {
background: linear-gradient(to right, #f0c27b, #4b1248);
}.nelson {
background: linear-gradient(to right, #f2709c, #ff9472);
}.forever-lost {
background: linear-gradient(to right, #5d4157, #a8caba);
}.blurry-beach {
background: linear-gradient(to right, #d53369, #cbad6d);
}.influenza {
background: linear-gradient(to right, #c04848, #480048);
}.jshine {
background: linear-gradient(to right, #12c2e9, #c471ed, #f64f59);
}.calm-darya {
background: linear-gradient(to right, #5f2c82, #49a09d);
}.titanium {
background: linear-gradient(to right, #283048, #859398);
}.pinky {
background: linear-gradient(to right, #dd5e89, #f7bb97);
}.purple-paradise {
background: linear-gradient(to right, #1d2b64, #f8cdda);
}.horizon {
background: linear-gradient(to right, #003973, #e5e5be);
}.noon-to-dusk {
background: linear-gradient(to right, #ff6e7f, #bfe9ff);
}