• HTML
• CSS

HTML

<div class="loader">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>

CSS

body{
    margin:0;
    padding:0;
    background:#17202a;
    display:flex;
    justify-content:center;
    align-items:center;
    height:100vh;
    
}
.loader{
    position:absolute;
    transform:rotate(45deg);
    width:50px;
    height:50px;
    animation:animate 1s linear infinite;
}
.loader span{
    position:absolute;
    width:25px;
    height:25px;
    background:#5d6d7e;

}
.loader span:nth-child(1){
    top:0;
    left:0;
}
.loader span:nth-child(2){
    top:0;
    right:0;
}
.loader span:nth-child(3){
    bottom:0;
    left:0;
}
.loader span:nth-child(4){
    bottom:0;
    right:0;
}

@keyframes animate
{
    0%{
        width:50px;
        height:50px;
    }
    10%{
        width:50px;
        height:50px;
    }
    50%{
        width:70px;
        height:70px;
    }
}