<div class="design">
<img src="http://i.pravatar.cc/500?img=2" alt="">
<div class="design__border"></div>
</div>
body {
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
.design {
position: relative;
height: 300px;
width: 300px;
}
.design > * {
position: absolute;
height: 100%;
width: 100%;
}
.design__border {
box-sizing: border-box;
border: 15px #eb311f solid;
transform: rotate(45deg);
box-shadow: 0 0 10px #eb311f, inset 0 0 20px #eb311f;
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.