Fill in the background of an HTML element using CSS

Let's assume that you have the following element:

<div class = 'Background'>
    Hello, the background will fill automatically in.

If you want to fill in the background progressively using CSS:

    animation: fill .4s ease-in-out .4s forwards;

@keyframes fill{
    100% {
        box-shadow: inset 0px 0px 0px 30px #42a1ec;

Hi, I'm Erik, an engineer from Barcelona. If you like the post or have any comments, say hi.