どうも！LSSです！！
radial-gradient（円形グラデーション）をやたらと並べて、リアリティのない迫ってくるような虹を作ってみました。
コード
<style>
.bgrbw{
width:300px;
height:185px;
border-radius:10px;
background-color:#000000;
background-image:
radial-gradient(closest-side circle,#000000ff 99%,#00000000 100%),
radial-gradient(closest-side circle,#800080ff 99%,#80008000 100%),
radial-gradient(closest-side circle,#0000ffff 99%,#0000ff00 100%),
radial-gradient(closest-side circle,#00ffffff 99%,#00ffff00 100%),
radial-gradient(closest-side circle,#00ff00ff 99%,#00ff0000 100%),
radial-gradient(closest-side circle,#ffff00ff 99%,#ffff0000 100%),
radial-gradient(closest-side circle,#ff8800ff 99%,#ff880000 100%),
radial-gradient(closest-side circle,#ff0000ff 99%,#ff000000 100%);
background-position:0px 105px,0px 95px,0px 85px,0px 75px,0px 65px,0px 55px,0px 45px,0px 35px;
background-size:160px 160px,180px 180px,200px 200px,220px 220px,240px 240px,260px 260px,280px 280px,300px 300px;
background-repeat:no-repeat;
}
</style>
<div class="bgrbw"> </div>
虹は7色ですが、その中に一番小さい黒の円も入れているので、8つのradial-gradientを重ねています。
簡潔ですが、今回はこのへんで！
次回もまた、よろしくお願いします^^
