The primary goal of Vevet is to simplify the creation of interactive components from scratch — be it text animations, carousels, or other interactive elements.
npm install vevet
JavaScript:
import { vevet } from 'vevet';
console.log(vevet.version); // => 5.0.0
SCSS:
@import '~vevet/lib/styles/index';
<script src="
https://cdn.jsdelivr.net/npm/vevet@5/lib/cdn/vevet.iife.min.js
"></script>
<script>
console.log(Vevet.app.version); // => 5.0.0
</script>
Canvas simplifies working with an HTML5 Canvas element and its 2D rendering context.
CanvasMedia enables pre-rendering of media assets (such as images and videos) onto a canvas.
Cursor is customizable custom cursor component with smooth animations and hover interactions.
InView is a visibility detection utility that leverages the IntersectionObserver API to monitor when elements enter or leave the viewport.
Marquee is custom marquee component that smoothly scrolls its child elements.
Pointers manages pointer events, including tracking multiple pointers, and emitting callbacks for pointer interactions.
Preloader manages the visibility and lifecycle of a loading screen.
ProgressPreloader calculates and displays the loading progress of resources (images, videos, custom elements).
Raf manages an animation frame loop with configurable FPS and playback controls.
ScrollProgress tracks the scroll progress of a specified section element.
Scrollbar is a custom scrollbar component.
SplitText splits text within a container into individual lines, words, and letters.
Swipe manages swipe interactions: tracks movement and detects direction, emits events on start, move, and end, supports inertia-based movement.
Timeline is a simple timeline class for managing animations with easing and precise progress control.