paste

<!DOCTYPE html>
<html>
    <head>
        <title>Loading</title>
        <style type="text/css">
            html,
            body{
                margin: 0;
                padding: 0;
                width: 100%;
                height: 100%;
                background-color: darkblue;
            }
            .loading{
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%,-50%);
                display: flex;
                align-items: center;
            }
            .bar{
                width: 6px;
                height: 100px;
                background-color: #FFF;
                margin: 0 3px;
                animation: loading 0.8s infinite;
            }

            .bar:nth-child(2){
                animation-delay: 0.1s;
            }
            .bar:nth-child(3){
                animation-delay: 0.2s;
            }
            .bar:nth-child(4){
                animation-delay: 0.3s;
            }
            .bar:nth-child(5){
                animation-delay: 0.4s;
            }
            .bar:nth-child(6){
                animation-delay: 0.5s;
            }
            @keyframes loading{
                0%{
                    height: 0;
                }
                50%{
                    height: 100px
                }
                100%{
                    height: 0;
                }
            }
        </style>
    </head>
    <body>
        <div class="loading">
            <div class="bar"></div>
            <div class="bar"></div>
            <div class="bar"></div>
            <div class="bar"></div>
            <div class="bar"></div>
            <div class="bar"></div>
        </div>
    </body>
</html>