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

Elastic Toggle

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

⤷ Забрать код

@HtmlGram1 | #css

Song Selector

Выбор песни анимация. Реализовано с помощью SCSS.

⤷ Забрать код

@HtmlGram1 | #scss

Circular Mask

Анимация переходов. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

3D Cover Flow

Анимированные карточки с интересным эффектом движения. Реализовано с помощью SCSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #scss #JavaScript

Notification Icon + Micro Interaction

Значок уведомления + микровзаимодействие. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

View transitions (Chrome 115+)

Просмотр переходов (Chrome 115+). Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css

Tailwind - Notifications and Messages

Компонент с сообщениями и уведомлениями. Cтилизованный c помощью Tailwind.

⤷ Забрать код

@HtmlGram1 | #css

Concentric Circle Loader

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

⤷ Забрать код

@HtmlGram1 | #scss #JavaScript

Slider

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

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Blurry Text Reveal

Размытый текст. Реализовано с помощью библиотеки gsap.

⤷ Забрать код

@HtmlGram1 | #css #JavaScript

Fading Footer

Необычное затухание нижнего колонтитула. Реализовано с помощью CSS.

⤷ Забрать код

@HtmlGram1 | #css