Понятия не имею кому при годится, но это строка загрузки на CSS На вывод

<div class="progress"></div>

                        
progress {

    background: #333;

    /* Фон */

    border: 2px solid #333;

    /* Рамка */

    height: 20px;

    /* Высота */

    position: relative;

    /* Относительное позиционирование */

}

.progress::before {

    animation: progress 5s;

    animation-timing-function: linear;

    animation-duration: 5s;

    animation-fill-mode: forwards;

    -webkit-animation-name: progress;

    -webkit-animation-timing-function: linear;

    -webkit-animation-duration: 5s;

    -webkit-animation-fill-mode: forwards;

    content:'';

    position: absolute;

    /* Абсолютное позиционирование */

    height: 100%;

    background: #FFA600;

    /* Фон */

}

@-webkit-keyframes progress {

    from {

        width: 0;

    }

    to {

        width: 100%;

    }

}

@keyframes progress {

    from {

        width: 0;

    }

    to {

        width: 100%;

    }

}