JSFiddle - React, Tailwind, and code Playground

by j08691

HTML

<div id="outer">
    <div id="wrapper">
        <div id="inner">TEXT</div>
    </div>
</div>

CSS

#outer {
    width:300px;
    height:300px;
    background-image: url(http://www.placekitten.com/300/300);
    overflow:auto;
}
#wrapper {
    background: #fff;
    margin: 100px 0;
}
#inner {
    font: bold 60px Arial;
    text-align:center;
    margin:20px;
    background-color: #fff;
    background-image: url(http://www.placekitten.com/300/300);
    background-position: 280px 201px;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}