✅ Создания крутой JavaScript анимации
Данная анимация, создана с помощью CSS и JS, в HTML там нужно создать лишь заголовок <h2> . Каждую секунду она плавно менять задний фон и тень текста на рандомный цвета, которые вы добавили в массив.
☑️ Делимся уже готовым CSS и JS кодом ниже, для создания крутой анимации: ⬇️
@code_ready | #css #js
Данная анимация, создана с помощью CSS и JS, в HTML там нужно создать лишь заголовок <h2> . Каждую секунду она плавно менять задний фон и тень текста на рандомный цвета, которые вы добавили в массив.
☑️ Делимся уже готовым CSS и JS кодом ниже, для создания крутой анимации: ⬇️
:root {
--color: #ffffff;
--background: #2196f3;
}
body{
font-family: 'Baloo Tamma 2', cursive;
font-weight: 800;
background: var(--background);
color: var(--color);
transition: 4s;
}
h2{
text-align: center;
width: 100%;
font-size: 80px;
letter-spacing: 5px;
transition: 4s;
text-shadow: -1px -1px 0px var(--background),
3px 3px 0px var(--background),
6px 6px 0px #00000055;
}const colors = [
'#2196f3',
'#f4,
'#3f5e',
'#ec4899',
'#6366f1',
'#3b82f6',
'#0ea5e9',
'#84cc16',
'#ef4444',
]
setInterval(() => {
const color = colors[Math.floor(Math.random()*colors.length)]
document.body.style.setProperty('--background', color)
}, 5000)
@code_ready | #css #js