Sliding Icon Menu

Меню с анимацией скольжения между пунктами-иконками. Реализован с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #javascript

Player/User Cards

Карточки игроков / пользователей с просмотром дополнительной информации при наведении курсора мыши. Реализованы на чистом CSS.

⤷ Забрать код

@HtmlGram1 | #css

Directionally Aware Controls

Эффект при наведении на кнопку с направленными элементами управления, реализованный на чистом CSS.

⤷ Забрать код

@HtmlGram1 | #css

Calculator

Калькулятор в современном стиле, реализованный с помощью Vue.js.

⤷ Забрать код

@HtmlGram1 | #vue

Profile Card UI

Карточка профиля.

⤷ Забрать код

@HtmlGram1 | #UI

Content reveal cards

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

⤷ Забрать код

@HtmlGram1 | #css #html

Hover Effect for Headers

8 примеров эффекта наведения для заголовков, реализованные на чистом CSS.

⤷ Забрать код

@HtmlGram1 | #css

Bold Hover Animations

10 стилей анимации при наведении на текст, реализованные с помощью Splitting.js.

⤷ Забрать код

@HtmlGram1 | #splittingjs

Timeline Carousel

Карусель с постерами и трейлерами фильмов, представленные в хронологическом порядке. Карусель реализована с помощью Vue.js и Embla Carousel.

⤷ Забрать код

@HtmlGram1 | #vue #EmblaCarousel

Password Input Light

Поле ввода пароля с необычным просмотром пароля, реализованное с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #javascript

Custom Cursor

Кастомный курсор с взаимодействием с элементами на странице. Реализован с помощью переменных CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #javascript

Responsive Grid

Адаптивная сетка без медиа-запросов на чистом CSS.

⤷ Забрать код

@HtmlGram1 | #css

Mask Text / CSS Clip

Анимация текста, реализованная с помощью CSS и GSAP.

⤷ Забрать код

@HtmlGram1 | #gsap

Horrible UX: Bad Buttons

Неотлипающаяся кнопка "Subscribe" и кнопка "Unsubscribe", которую невозможно нажать, реализованные с помощью React.

⤷ Забрать код

@HtmlGram1 | #react

Scrolly Path

Причудливая анимация пути при прокрутке страницы, реализованная с помощью SVG, GSAP и ScrollTrigger.js.

⤷ Забрать код

@HtmlGram1 | #ScrollTrigger #svg #gsap

Cinematic Animation

Красивая кинематографическая анимация, реализованная на чистом CSS.

⤷ Забрать код

@HtmlGram1 | #css

Bouncing Text Animation

Анимация отскока текста, реализованное с помощью CSS и Splitting.js.

⤷ Забрать код

@HtmlGram1 | #css #splittingjs

Vue Slider UI Interaction

Пример интерактивного интерфейса в слайдере, реализованный с помощью Vue и Vibrant.js.

⤷ Забрать код

@HtmlGram1 | #vibrantjs #vue

Shapes, Clip-Path and CSS Grid

Демонстрация CSS Shapes, CSS-свойства clip-path и CSS Grid.

⤷ Забрать код

@HtmlGram1 | #css

Signup Form 3D FLIP Animation

3D-анимация формы регистрации, реализованная с помощью CSS и JavaScript.

⤷ Забрать код

@HtmlGram1 | #css #javascript

CanvasTexture on 3d geometry

Трехмерная анимация текста, реализованная с помощью Three.js.

⤷ Забрать код

@HtmlGram1 | #threejs