ReelKit

Slider de un solo elemento para experiencias al estilo de TikTok / Instagram Reels

Independiente del framework, virtualizado y pensado para el tacto. Hecho para feeds verticales de vídeo, visores de stories y galerías a pantalla completa.

React

Angular

Vue

Empezar Star on GitHub

Virtualized

Only 3 slides in DOM

Demo en vivo: usa las flechas

Pensado para el rendimiento

Renderizado virtualizado, sin dependencias, transiciones a 60 fps

3en el DOM

Virtualizado

Admite más de 10.000 elementos. Solo se renderizan 3 slides a la vez.

0dependencias

Sin dependencias

Ninguna dependencia en tiempo de ejecución. El core ocupa ~10.1 kB con gzip.

60fps

Táctil ante todo

Gestos de deslizamiento nativos con inercia y puntos de ajuste.

Alto rendimiento

Navegación con teclado

Independiente del framework

TypeScript ante todo

Headless + con estilos

Componentes listos para usar

Estado en la URL compartible

¿Por qué «ReelKit»?

Reel — feeds verticales de vídeo como los de Instagram Reels y TikTok. Un contenido cada vez; desliza para pasar al siguiente.

Kit — un conjunto modular de paquetes. Usa el core headless para tener control total, los bindings de framework para empezar rápido o los overlays listos para usar para reproductores de vídeo y galerías de imágenes.

API sencilla

Empieza con unas pocas líneas de código

tsx

import { Reel, ReelIndicator } from '@reelkit/react';

const items = ['Slide 1', 'Slide 2', 'Slide 3'];

function App() {
  return (
    <Reel
      count={items.length}
      size={[400, 600]}
      itemBuilder={(index) => (
        <div className="slide">{items[index]}</div>
      )}
    >
      <ReelIndicator />
    </Reel>
  );
}