JSFiddle - React, Tailwind, and code Playground

by dima_makh

HTML

<script src="https://rawgithub.com/wout/svg.js/master/dist/svg.min.js"></script>
<div id="svg-wrap">
  <img src="http://imgholder.ru/500x300">
</div>

CSS

#svg-wrap {
    width: 500px;
    height: 300px;
    background: gray;
    trans
}

CoffeeScript

draw = SVG 'svg-wrap'
a = draw.rect '50%', '50%'
a.fill '#fff'
a.center 250, 150

b = a.clone()
b.fill 'red'

img = draw.image 'http://imgholder.ru/400x250', 400, 250

img.maskWith a