JSFiddle - React, Tailwind, and code Playground
HTML
<div class='fancy-triangle-image'>
<svg width="100%" height="100%" viewBox="0 0 100 100">
<clipPath id="clipTriangle">
<polygon points="0 50 100 50 50 0"/>
</clipPath>
<image clip-path="url(#clipTriangle)" preserveAspectRatio="none" width="100%" height="100%" xlink:href="http://insolitebuzz.fr/wp-content/uploads/2014/10/test-all-the-things.jpg"/><!--your src-->
</svg>
</div>