Componentes vivos para copiar: efectos, mockups y fondos
Una colección de 31 componentes web que se han usado en sitios reales y no fueron escritos como demostración, cada uno en versión HTML independiente y en versión React. Aquí hay lo que todo sitio web comercial necesita, como preguntas frecuentes desplegables, lista de precios con interruptor, horario de apertura, cuenta regresiva, antes y después, y un botón flotante de WhatsApp. También incluye efectos más pesados como un chat de WhatsApp en un teléfono, un brillo que sigue al cursor, aparición al desplazarse, fondos WebGL y fuegos artificiales. Cada componente tiene una vista previa en vivo. La versión HTML se pega en cualquier sitio web, y la versión React con Tailwind es adecuada para proyectos Lovable, Vite o Next. Ningún componente requiere una biblioteca externa y puedes descargar toda la pestaña en un único archivo ZIP.
La versión HTML es un único fragmento que se pega antes de la etiqueta de cierre de body en cualquier sitio web, incluso si no está construido en React. La versión React es un archivo de componente para un proyecto existente. En la práctica, ambas son el mismo componente.
No. Todos los componentes se escribieron sin dependencias externas, incluidos aquellos que originalmente usaban framer-motion o gsap.
Sí. La vista previa ejecuta exactamente la versión HTML que descargas, dentro de un marco aislado.
Sí. El código está diseñado para pegarse en tus proyectos, incluyendo trabajos para clientes.
Klix no se ha podido cargar
Prueba primero a recargar la página. Si acaba de salir una versión nueva, recargar lo soluciona al instante.
Si recargar no ha servido, puede que tu navegador sea demasiado antiguo. Klix ejecuta las herramientas en tu propio dispositivo y no en un servidor, así que necesita un navegador de 2022 o posterior. Qué hacer: actualiza Chrome o Firefox y vuelve a abrir klixtools.com.