JSFiddle - React, Tailwind, and code Playground

by web tiki

HTML

<div></div>

CSS

div{
    position:relative;
    width:30%; padding-bottom:30%;
    background:#000;
    overflow:hidden;
}
div:before, div:after{
    content:'';
    position:absolute;
}
div:before{
    bottom:-325px; left:-327px;
    border-left: 1000px solid #fff;
    border-bottom:1000px solid transparent;
}
div:after{
    top:-325px; right:-327px;
    border-right: 1000px solid #fff;
    border-top:1000px solid transparent;
}