Появление текста
Шиммер-блик
Узкая полоса света бесконечно пробегает по буквам через background-clip.
Просто смотрите.
ШИММЕР ПО ТЕКСТУ
блик пробегает бесконечно — как по металлу
Код
<h1 class="shimmer">ЗАГОЛОВОК</h1>
<style>
.shimmer {
background: linear-gradient(110deg,
#3a4150 42%, #f2f5fa 50%, #3a4150 58%); /* узкий блик */
background-size: 220% 100%;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
animation: shm 2.6s linear infinite;
}
@keyframes shm {
from { background-position: 120% 0; }
to { background-position: -120% 0; } }
</style>
Промпт для ИИ
Сделай шиммер-блик по тексту: градиент linear-gradient(110deg, тёмный 42%, светлый 50%, тёмный 58%) с background-size 220% 100%, background-clip:text + color:transparent; анимация background-position от 120% к -120% за 2.6s linear infinite — узкая полоса света пробегает по буквам. Хорош для лоадеров и акцентных слов. При prefers-reduced-motion — статичный цвет.