This media is not supported in your browser
VIEW IN TELEGRAM
🍏 Magnify Glass / Zoom
Изначально на картинку накладывается фильтр blur. В js создана логика, благодаря который фильтр убирается в месте, где находится курсор пользователя.
⤷Забрать код
@HtmlGram | #css #js
Изначально на картинку накладывается фильтр blur. В js создана логика, благодаря который фильтр убирается в месте, где находится курсор пользователя.
⤷Забрать код
@HtmlGram | #css #js
This media is not supported in your browser
VIEW IN TELEGRAM
🏓 Кнопки навигации
Переключающиеся пункты меню, при нажатии применяется анимация написанная на SCSS и JS.
⤷Забрать код
@HtmlGram | #scss #js
Переключающиеся пункты меню, при нажатии применяется анимация написанная на SCSS и JS.
⤷Забрать код
@HtmlGram | #scss #js
This media is not supported in your browser
VIEW IN TELEGRAM
☕ Цветные линии
Градиентная линия постоянно изменет свою форму, выполнена в виде SVG.
⤷Забрать код
@HtmlGram | #css #js
Градиентная линия постоянно изменет свою форму, выполнена в виде SVG.
⤷Забрать код
@HtmlGram | #css #js
This media is not supported in your browser
VIEW IN TELEGRAM
🚲 Велосипед
Приходилось ли вам реализовывать сложную анимацию?
Не изобретай велосипед, используй готовый код.
⤷Забрать код
@HtmlGram | #css #js
Приходилось ли вам реализовывать сложную анимацию?
Не изобретай велосипед, используй готовый код.
⤷Забрать код
@HtmlGram | #css #js
This media is not supported in your browser
VIEW IN TELEGRAM
💙 Пазл
Сами фрагменты создаются через JS и анимируется с помощью CSS keyframes. При этом для анимации используются CSS переменные, значения которым задаются через JS.
⤷Забрать код
@HtmlGram | #scss #js
Сами фрагменты создаются через JS и анимируется с помощью CSS keyframes. При этом для анимации используются CSS переменные, значения которым задаются через JS.
⤷Забрать код
@HtmlGram | #scss #js
This media is not supported in your browser
VIEW IN TELEGRAM
Social Media Icons
Иконки c всплывающими окнами, реализованные на чистом CSS, без использования JavaScript
⤷Забрать код
@HtmlGram | #css
Иконки c всплывающими окнами, реализованные на чистом CSS, без использования JavaScript
⤷Забрать код
@HtmlGram | #css
This media is not supported in your browser
VIEW IN TELEGRAM
🤘 Sidebar
Фон сайдбара является svg картинкой, которая анимируется через js при нажатии.
⤷Забрать код
@HtmlGram | #scss #js
Фон сайдбара является svg картинкой, которая анимируется через js при нажатии.
⤷Забрать код
@HtmlGram | #scss #js
This media is not supported in your browser
VIEW IN TELEGRAM
Menu Animation
Анимация кнопки меню, реализованная с помощью CSS и JavaScript.
⤷Забрать код
@HtmlGram | #анимация #меню #кнопка #css #javascript
Анимация кнопки меню, реализованная с помощью CSS и JavaScript.
⤷Забрать код
@HtmlGram | #анимация #меню #кнопка #css #javascript
This media is not supported in your browser
VIEW IN TELEGRAM
Positive Negative
Слайдер температуры с положительным и отрицательным значениями. Реализован с помощью Vue.
⤷Забрать код
@HtmlGram | #слайдер #vue
Слайдер температуры с положительным и отрицательным значениями. Реализован с помощью Vue.
⤷Забрать код
@HtmlGram | #слайдер #vue
This media is not supported in your browser
VIEW IN TELEGRAM
Animated BottomBar
Несколько вариантов анимаций нижней панели, реализованные с помощью CSS и JavaScript.
⤷Забрать код
@HtmlGram | #анимация #tabbar #css #javascript
Несколько вариантов анимаций нижней панели, реализованные с помощью CSS и JavaScript.
⤷Забрать код
@HtmlGram | #анимация #tabbar #css #javascript
⚙️Анимация загрузки
Оставляем для вас ниже код, который поможет создать анимацию загрузки на HTML, CSS и JavaScript.
⤷Посмотреть код
@HtmlGram | #html #css #javascript
Оставляем для вас ниже код, который поможет создать анимацию загрузки на HTML, CSS и JavaScript.
⤷Посмотреть код
@HtmlGram | #html #css #javascript
This media is not supported in your browser
VIEW IN TELEGRAM
🪴CSS3 Loader & Spinners
Набор анимаций загрузки, реализованных SCSS, без применения JavaScript.
⤷Забрать код
@HtmlGram | #scss
Набор анимаций загрузки, реализованных SCSS, без применения JavaScript.
⤷Забрать код
@HtmlGram | #scss
This media is not supported in your browser
VIEW IN TELEGRAM
StockAI — бесплатные стоковые фото, созданные ИИ
Картинки высокого качества, полностью созданные искусственным интеллектом. Можно использовать в любом проекте, не беспокоясь об авторском праве.
Искать нужные картинки можно через строку поиска или через категории: природа, портреты, еда, путешествия, бизнес и животные.
#нейросеть #фото
Картинки высокого качества, полностью созданные искусственным интеллектом. Можно использовать в любом проекте, не беспокоясь об авторском праве.
Искать нужные картинки можно через строку поиска или через категории: природа, портреты, еда, путешествия, бизнес и животные.
#нейросеть #фото
This media is not supported in your browser
VIEW IN TELEGRAM
🫧Glow Button
Кнопка с эффектом при наведении, реализованная на SCSS и SVG, с применением JavaScript
⤷Глянуть код
@HtmlGram | #scss #javascript
Кнопка с эффектом при наведении, реализованная на SCSS и SVG, с применением JavaScript
⤷Глянуть код
@HtmlGram | #scss #javascript
This media is not supported in your browser
VIEW IN TELEGRAM
💥 Magic card
Небольшой контейнер с переливающейся рамкой, при нажатии на который показывается информация внутри. Отлично подойдёт для отображения чего-то интересного для пользователя.
⤷Забрать код
@HtmlGram | #css
Небольшой контейнер с переливающейся рамкой, при нажатии на который показывается информация внутри. Отлично подойдёт для отображения чего-то интересного для пользователя.
⤷Забрать код
@HtmlGram | #css
This media is not supported in your browser
VIEW IN TELEGRAM
🎯 Link hover animation
Анимация при наведении на ссылку, реализованная с помощью SCSS и SVG, без использования JavaScript
⤷Забрать код
@HtmlGram | #scss
Анимация при наведении на ссылку, реализованная с помощью SCSS и SVG, без использования JavaScript
⤷Забрать код
@HtmlGram | #scss
This media is not supported in your browser
VIEW IN TELEGRAM
🎛️Hover Blur Cards
Эффект при наведении на карточки, реализованный на CSS, с применением JavaScript
⤷Забрать код
@HtmlGram | #css #javascript
Эффект при наведении на карточки, реализованный на CSS, с применением JavaScript
⤷Забрать код
@HtmlGram | #css #javascript
This media is not supported in your browser
VIEW IN TELEGRAM
🍩 Rotation Navigation
В этой реализации автор создал импровизированный слайдер с интересным эффектом переключения.
⤷Забрать код
@HtmlGram | #scss #js
В этой реализации автор создал импровизированный слайдер с интересным эффектом переключения.
⤷Забрать код
@HtmlGram | #scss #js