Card3D-con-SvelteKit Svelte Themes

Card3d Con Sveltekit

Card interactiva en 3D utilizando SvelteKit y Contador de clicks

Card3D con SvelteKit 🚀

Alt Text

¡Bienvenido a Card3D con SvelteKit! Este proyecto es un ejemplo de cómo crear una tarjeta interactiva en 3D utilizando SvelteKit.

Funcionalidades ✨

  • La tarjeta responde al movimiento del ratón y al pasar el cursor sobre ella con efectos de rotación.
  • Los botones de acción (LinkedIn y GitHub) cambian de color al pasar el cursor sobre ellos.
  • Un botón en forma de corazón cuenta los clics cuando se presiona.
  • El fondo de la aplicación está compuesto por tres gradients superpuestos que se mueven de forma sincronizada, creando un efecto visual dinámico y llamativo.

Tecnologías Utilizadas 🛠️

  • SvelteKit: Framework para la construcción de aplicaciones web.
  • CSS: Estilos para la apariencia y la interacción de la tarjeta.

Creación de un Proyecto con SvelteKit 🚧

# crear un nuevo proyecto en el directorio actual
npm create svelte@latest

# crear un nuevo proyecto en my-app
npm create svelte@latest my-app

Cómo Usar 🚀

# clona este repositorio

git clone https://github.com/Irina-Ichim/Card3D-con-SvelteKit.git
# Inicia el servidor de desarrollo:

npm run dev

Abre tu navegador y visita http://localhost:5173/ o https://plantilla-con-svelte.vercel.app/ para ver la aplicación en funcionamiento.

Contribución 🤝

Si deseas contribuir a este proyecto, ¡siéntete libre de hacerlo! Simplemente abre un issue o envía una solicitud de extracción.

Autor 👩‍💻 Este proyecto fue creado por Irina Ichim. <www.irina-ichim.com>

¡Gracias por tu interés en este proyecto! 😊

Top categories

Loading Svelte Themes