Note that this demo has been deliberately set up to replace inline SVG tag code with D3.js generated SVG. Thus if you click on the HTML tab it is quite simple. All the SVG action takes place using D3.js to generate the rectangles with stylings and responsive coding. They are responsive because the D3.js adapts the SVG size to the individual elements and overall scene settings. Using media queries the page can be made totally responsive. One of the generated attributes is the class=’box’. This class is assigned to each SVG rectangle. Then the CSS tab shows each of the rectangles can be animated with hovering over a rectangle triggering a stroke around being drawn. If you click and hold the mouse down on any rectangle it will gradually disappear. Release the mouse button and the box reappears. Summary The above CodePen is just a sampling of what can be done with SVG through D3.js. The D3.js code like jQuery is open source and there are some great tutorials for using D3.js and SVG here and here. And W3schools has a solid overview of SVG here. In sum, if drawings, animations, and infographics are important to you on the Web then so are SVG+D3.js .