create a rainbow background using css linear gradient

just incase one gradient is not enough for you we can also use it to create a rainbow background gradient

HTML

<p>here is a more advanced example using 4 color points<p>
<div class='test-box linear-gradient-multi-rainbow'>multi point linear gradient</div>

CSS

.test-box {
  min-height:300px;
  width:100%;
  margin-bottom:20px;
  padding:20px;
  text-align:center;
  color:#FFF;
  text-shadow:0px 1px 2px #000;
}
.linear-gradient-multi-rainbow {
background:linear-gradient(45deg, #dc3b3e, #3b99dc 50%, #3bdc90 75%, rgb(255 141 0) 100%);
}

here is a more advanced example using 4 color points

multi point linear gradient

Other Items in css

No Items Found.

Add Comment
Type in a Nick Name here
 
Page Views

This page has been viewed 623 times.

Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code snippits here, mostly for my reference. Also if i find a good site, i usually add it here.

โค๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ•น

Random Quote
I believe that success can be measured in the number of uncomfortable conversations you're willing to have.
Unknown