JSFiddle - React, Tailwind, and code Playground

HTML

<div class="background-border">

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut quisquam eius maxime quibusdam reprehenderit sapiente ratione, facilis ipsam illo soluta atque consequatur maiores in dolorum nam accusamus totam veritatis tenetur!
</p>

</div>

<br>

<div class="background-border">

<img src="https://senseiminimal.github.io/Dragonic/img/Dragonic.jpg">

</div>

CSS

img {
  max-width: 100%;
}

.background-border {
  
  color: white;
	box-shadow: 0 1px 15px rgba(0, 0, 0, .75);

	background:

	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/left-top-corner.png') left -1px top -1px no-repeat,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/right-top-corner.png') right -1px top -1px no-repeat,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/left-bottom-corner.png') left bottom no-repeat,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/right-bottom-corner.png') right bottom no-repeat,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/top-horizontal-bar.png') left top repeat-x,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/bottom-horizontal-bar.png') left bottom repeat-x,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/left-vertical-bar.png') left bottom repeat-y,
	url('https://us.diablo3.com/static/images/reaper-of-souls/ui/media-frame/right-vertical-bar.png') right top repeat-y black;


}