<div class="page foldtl">
  <img src="https://unsplash.it/400" alt="" />
</div>

<!-- Followed this guide - https://designshack.net/articles/css/code-a-simple-folded-corner-effect-with-css/  -->
/* page styles */
body {
  background: white;
}
.page {
  background: #fefefe;
  width: 330px;
  margin: 50px;
}
.page h2 {
  padding: 85px 0 0 20px;
  font: 400 35px/1.5 'Lilita One', Helvetica, sans-serif;
}
.page p {
  padding: 10px 20px;
  font: 12px/1.5 Helvetica, sans-serif;
  color: #4b4b4b;
}

.foldtl {
  img {
    vertical-align: bottom;
    max-width: 100%;
  }
  
  position: relative;
  
  &:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-bottom: 50px solid #ddd;
    border-right: 50px solid #888;
    -webkit-box-shadow: -7px 7px 7px rgba(0,0,0,0.5);
    -moz-box-shadow: -7px 7px 7px rgba(0,0,0,0.5);
    box-shadow: -7px 7px 7px rgba(0,0,0,0.5);
  }
  
  -webkit-box-shadow: -5px 5px 5px rgba(0,0,0,0.8);
  -moz-box-shadow: -5px 5px 5px rgba(0,0,0,0.8);
  box-shadow: -5px 5px 5px rgba(0,0,0,0.8);
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.