Demo: CSS mask-size

<div class='masked-box'></div>

.masked-box {
  width: 300px;
  height: 300px;
  background-color: #3498db;
  -webkit-mask-image: url('https://via.placeholder.com/300/ff0000/ffffff?text=Mask');
  mask-image: url('https://via.placeholder.com/300/ff0000/ffffff?text=Mask');
  -webkit-mask-size: 150px 150px;
  mask-size: 150px 150px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
}

// No JavaScript required for this demo