<p>Hellg fggf o  gf fggf o  gfg  gd fggf o  gfg  gd fggf o  gfg  gdg  gdf Mask</p>
<p class="radial">Hello jhgj  jhgj  jhgMask</p>

@import url('https://fonts.googleapis.com/css2?family=Reggae+One&display=swap');

html, body {
    width: 100%;
    height: 100%;
    display: flex;
    background: #000;
}

p {
        margin: auto;
        font-family: 'Reggae One', cursive;
        font-size: 48px;
        color: #fff;
        mask: radial-gradient(circle at 0 50%, #000, transparent 10%, transparent 0);
        mask-size: 100%;
        animation: scale 5s infinite;
}

.radial {
    mask: radial-gradient(circle at 50% 0, #000, transparent 20%, transparent 0);
    mask-size: 100% 100%;
    animation: scale2 5s infinite;
}

@keyframes scale {
    50%,
    100% {
        mask-size: 2000%;
    }
}

@keyframes scale2 {
    50%,
    100% {
        mask-size: 100% 2000%
    }
}

// p:hover {
//     transition: 3s all;
//     mask-size: 1500%;
// }