❄️ vue3-snowfall

Un elegante efecto de nieve para Vue 3, listo para usar con soporte para imágenes personalizadas, intensidad, tamaño y velocidad.

🎮 Demo en vivo: https://vue3-snowfall.netlify.app

🚀 Instalación

npm install vue3-snowfall
# o
yarn add vue3-snowfall

🧩 Uso básico

<template>
  <SnowEffect />
</template>

<script setup lang="ts">
import SnowEffect from "vue3-snowfall"
</script>

Esto mostrará un efecto de nieve cayendo sobre toda la pantalla ❄️

⚙️ Props disponibles

| Prop | Tipo | Default | Descripción | | ---------------- | ---------- | ------- | ------------------------------------------------------------------------------ | | snowflakeCount | number | 150 | Número de copos de nieve visibles. | | speed | number | 1 | Velocidad general de caída. | | size | number | 10 | Tamaño máximo de cada copo. | | images | string[] | [] | Permite usar imágenes personalizadas como copos. Ej: rutas a .png o .webp. | | color | string | #fff | Color de los copos si no se usan imágenes. | | opacity | number | 1 | Transparencia general del efecto. |

🎨 Ejemplo con imágenes personalizadas

<template>
  <SnowEffect
    :images="[snowflake1, snowflake2]"
    :snowflakeCount="100"
    :speed="1.2"
    :size="15"
  />
</template>

<script setup lang="ts">
import SnowEffect from "vue3-snowfall"
import snowflake1 from "@/assets/snowflake.png"
import snowflake2 from "@/assets/snowflake1.webp"
</script>

🧠 Recomendaciones

• Coloca el componente dentro del layout o en la raíz de tu aplicación para un efecto global.
• Puedes superponerlo con otros elementos sin afectar su interacción (pointer-events: none ya está aplicado).

🪄 TypeScript

Los tipos se incluyen automáticamente al importar el componente, por lo que puedes disfrutar de autocompletado y verificación de props en tu editor.

🧰 Compatibilidad

• Vue 3
• Vite / Nuxt 3 / Vue CLI
• TypeScript compatible

📦 Publicación

Disponible en npm: 👉 https://www.npmjs.com/package/vue3-snowfall

🧑‍💻 Autor

Desarrollado por Daniel Contreras 💬 Si te gusta, deja una ⭐ en el repositorio.