эффекты
Built by Luneka Lab digital agency

Halo Card Hover

Подходит для карточек услуг, UI-объектов и feature-блоков, где нужен премиальный hover.

Custom hookPointer gradients
Готовый сниппет для переноса

У каждой демки есть React-компонент, который можно скопировать и адаптировать под HTML embed или кастомный блок в Tilda. Библиотека собрана Luneka Lab как showroom motion-подходов для клиентских сайтов.

Написать намРаботать с нами
Назад в библиотеку
Загрузка сцены
React component

Halo Card Hover

'use client';

import { useRef } from 'react';
import { useMousePosition } from '@/hooks/useMousePosition';

export function HaloCardHover() {
  const ref = useRef<HTMLDivElement>(null);
  const { x, y } = useMousePosition(ref);

  return <div ref={ref} style={{ backgroundImage: ['radial-gradient(circle at ', (x + 0.5) * 100, '% ', (y + 0.5) * 100, '%, rgba(187,255,0,0.24), transparent 18%)'].join('') }} />;
}