Wave анимация текста на чистом CSS HTML: <div class="text"> <div class="title">Wave animation text</div> <div class="title">Wave animation text</div> </div> CSS: .text { position: relative; } .title { color: #fff; font-size: 72px; font-weight: bold; position: absolute; transform: translate(-50%, -50%); text-transform: uppercase; white-space: nowrap; } .text > .title:nth-child(1) { color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, 0.308); } .text > .title:nth-child(2) { color: #73aaf7; animation: animate 4s linear infinite; } @keyframes animate { 0%, 100% { clip-path: polygon( 0% 45%, 16% 44%, 33% 50%, 54% 60%, 70% 61%, 84% 59%, 100% 52%, 100% 100%, 0% 100% ); } 50% { clip-path: polygon( 0% 60%, 15% 65%, 34% 66%, 51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100% ); } } ⚡️ Навыкиверстальщика | CSS