Demo: CSS mask-border-source

<div class='masked-border'>Hello, World!</div>

.masked-border { 
  width: 300px; 
  height: 100px; 
  display: flex; 
  justify-content: center; 
  align-items: center; 
  font-size: 24px; 
  color: white; 
  background-color: #007BFF; 
  mask-border-source: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAAFCAIAAAwU3pVAAAAA3NCSVQICAjb4U/gAAAAJcEhZcwAACxMAAAsTAQAAAABYd2UAAAAA
AElFTkSuQmCC'); 
  mask-border-slice: 20; 
  mask-border-width: 10px; 
  mask-border-mode: alpha; 
  mask-type: alpha; 
}

// No JavaScript required for this demo