Rainbow

Create a rainbow with a Gaussian blur SVG filter effect.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <style type="text/css">
    svg {
      width: 500px;
      height: 250px;
    }
    path {
      opacity: 0.6;
    }
    .violet {
      fill: #9900FF;
    }
    .indigo {
      fill: #4400FF;
    }
    .blue {
      fill: #0099FF;
    }
    .green {
      fill: #00FF00;
    }
    .yellow {
      fill: #FFEE00;
    }
    .orange {
      fill: #FF6600;
    }
    .red {
      fill: #FF0000;
    }

</style>
</head>
<body>
<svg>
  <filter id="f1" x="-10%" y="-10%">
      <feGaussianBlur in="SourceGraphic" stdDeviation="4" />
    </filter>
  <g transform="translate(250, 250)"></g>
</svg>
</body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script type="text/javascript">
var arcGenerator = d3.arc();
arcGenerator
  .startAngle(-0.5 * Math.PI)
  .endAngle(0.5 * Math.PI);

var violet = arcGenerator({ 
  innerRadius: 180,
  outerRadius: 190
});

var indigo = arcGenerator({ 
  innerRadius: 190,
  outerRadius: 200
});

var blue = arcGenerator({ 
  innerRadius: 200,
  outerRadius: 210
});

var green = arcGenerator({ 
  innerRadius: 210,
  outerRadius: 220
});

var yellow = arcGenerator({ 
  innerRadius: 220,
  outerRadius: 230
});

var orange = arcGenerator({ 
  innerRadius: 225,
  outerRadius: 235
});

var red = arcGenerator({ 
  innerRadius: 235,
  outerRadius: 245
});

d3.select('g').style("filter", "url(#f1)")

d3.select('g')
  .append('path')
  .classed('violet', true)
  .attr('d', violet)

d3.select('g')
  .append('path')
  .classed('indigo', true)
  .attr('d', indigo);

d3.select('g')
  .append('path')
  .classed('blue', true)
  .attr('d', blue);

d3.select('g')
  .append('path')
  .classed('green', true)
  .attr('d', green);

d3.select('g')
  .append('path')
  .classed('yellow', true)
  .attr('d', yellow);

d3.select('g')
  .append('path')
  .classed('orange', true)
  .attr('d', orange);

d3.select('g')
  .append('path')
  .classed('red', true)
  .attr('d', red);
</script>
</html>

https://d3js.org/d3.v4.min.js