Una biblioteca de animaciones de carga reutilizables en estilo dotmatrix para React y Next.js, instalable a través del registro de shadcn o copiando el código fuente directamente desde la documentación.
Qué hace
Dotmatrix es una biblioteca de animaciones de carga reutilizables en estilo dotmatrix para React y Next.js. Los componentes pueden añadirse mediante una instalación desde un registro estilo shadcn o copiándolos directamente desde el sitio de documentación. El proyecto es una única app de Next.js donde los componentes de carga y el registro compilado se sirven de forma conjunta.
Dotmatrix es una biblioteca de animaciones de carga reutilizables en estilo dotmatrix para React y Next.js. Ofrece dos formas de consumo: instalar a través de un registro estilo shadcn (la ruta principal) o copiar el código fuente directamente desde la documentación. El proyecto es una única app de Next.js donde los componentes de carga conviven con un registro ya compilado (registry.json y public/r/), de modo que la misma base de código sirve tanto a la galería de documentación como a los componentes instalables. Hay un sitio de documentación en vivo alojado en dotmatrix.zzzzshawn.cloud, y el registro puede publicarse con una página de inicio configurable y listarse en el directorio oficial de registros de shadcn.
Características
Notas de campo
Revisado el Jun 21, 2026
Ideal para
Resultados para creadores
Ten cuidado
Probado con
Costo
Gratuito y de código abierto.
Herramientas usadas
Una biblioteca de animaciones de carga reutilizables en estilo dotmatrix para React y Next.js, instalable a través de un registro estilo shadcn o copiando el código fuente desde la documentación.
Instálalo a través del registro de shadcn (la ruta principal), o copia el código fuente del componente directamente desde la documentación.
La galería de documentación en vivo está alojada en dotmatrix.zzzzshawn.cloud.
shawn.@zzzzshawn
“Introducing dotmatrix v1.5.0 +10 new hex loaders New playground to tweak loaders (uses dialkit by @joshpuckett) bloom and halo effects added Cheers”
jQueryScript@jqueryscript
“Dotmatrix Loader Library: 55+ free and open-source loaders, built with React, TypeScript, Tailwind CSS, and shadcn. Install one, copy the code, and make it yours.”
Una colección de spinners, loaders y animaciones de carga para aplicaciones web modernas, construida con React, Next.js, shadcn/ui, Tailwind CSS y Framer Motion.
Best for Añadir spinners y animaciones de carga rápidamente78+ animated shadcn/ui components plus 100+ AI agent patterns, distributed as copy-paste source, free, open-source, and zero npm lock-in.
Best for React and Tailwind teams already using shadcn/ui who want animated, accessible components without npm package overheadUna biblioteca de componentes con glassmorfismo inspirada en Apple, construida sobre shadcn/ui y Base UI, con componentes de estilo glass listos para usar (alert, button, card, calendar, popover, sidebar y más) instalables mediante el registro de shadcn.
Best for Añadir UI con glassmorfismo a un proyecto shadcn/uiUna galería ligera de animaciones de carga basadas en curvas matemáticas: curvas de rosa, figuras de Lissajous, hipotrocoides, cardioedes y más, construida en HTML, CSS y JavaScript puro con notas de fórmulas y código listo para copiar.
Best for Animaciones de carga distintivas impulsadas por matemáticasshadcn/ui, open-source, copy-owned UI components for developers building their own design system with full code control.
Best for Teams building a custom design system who need full ownership of component source codeUn efecto animado de metal líquido con WebGL para React; envuelve un botón, chip o icono para darle un anillo de metal en tiempo real, con presets, tematización, intensidad ajustable y reflejo de proximidad opcional en elementos vecinos.
Best for Un acento de metal WebGL premium en botones o iconos clave