Zoom animation

Прикольная анимация зума для фото. Реализовано с помощью SCSS.

⤷ Забрать код

@HtmlGram1 | #scss

Switch Day and Night - Cat

Переключить день и ночь с котиком. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Star Wars Imperial Army's Product Slider

Крутой слайдер продукции «Звездных войн». Свёрстано на SCSS, а функционал слайдера реализовано с помощью библиотеки Swiper.

⤷ Забрать код

@HtmlGram1 | #scss #Swiper

Social icon animation

Анимация социальных иконок. Реализовано с помощью JS.

⤷ Забрать код

@HtmlGram1 | #JavaScript

Pixelate

Эффект размытия на пиксельном тексте. Реализовано с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Parallax Depth Cards

Красивый эффект карточек при наведении. Реализовано с помощью CSS и Vue.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Masked SVG Loader

Красивая анимация загрузки. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Exploring UI

Изучение пользовательского интерфейса. Реализовано с помощью JavaScript и библиотеки GSAP.

⤷ Забрать код

@HtmlGram1 | #JavaScript #gsap

Icon Hover Effect Using

Использование эффекта наведения на иконку. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Slider with Button Wave Effect

Слайдер с эффектом волны кнопки. Реализовано с помощью JavaScript и GSAP.

⤷ Забрать код

@HtmlGram1 | #JavaScript #gsap

Logo Marquee + blurring

Хорошенький блюр с иконками. Реализовано с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

animated text

Анимированный текст. Реализовано с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Collapsible Timeline

Складная временная шкала. Реализовано с помощью CSS и JS.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Infinite Scroll Multi-Directional Content

Бесконечная прокрутка многонаправленного контента. Реализовано с помощью React.

⤷ Забрать код

@HtmlGram1 | #React

Responsive Portfolio

Полноценная страница-портфолио, свёрстанная в стиле macOS. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Skeuomorphic Range Slider

Скевоморфный ползунок диапазона. Реализовано с помощью CSS и JS.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Preview the image

Предварительный просмотр изображения перед загрузкой. Реализовано с помощью CSS и JS.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Accordion with Reveal Animation

Раскрывающийся список. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Curved Range Slider

Изогнутый ползунок диапазона. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Hidden Search Widget

Виджет скрытого поиска. Реализовано с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Dot Map

Интересная карта из точками, которые движутся. Вся сцена - это SVG картинка, анимируемая при помощи тегов <animate>.

⤷ Забрать код

@HtmlGram1 | #css