Components
Animated Hero with WebGL Glitter
A sophisticated full-screen hero component featuring smooth Framer Motion entrance animations and a WebGL shader-based glitter overlay. Built with React Three Fiber and custom GLSL shaders for realistic sparkle effects. Includes responsive typography with Google Fonts integration, two-column layout with gradient transitions, and GPU-accelerated rendering for optimal performance.
/**
* WebGL Glitter Background Demo
*
* Showcases the WebGL glitter background effect.
* Customize the speed and intensity of the sparkle animation.
*/
import { Component } from '@/components/ui/animated-hero-with-web-gl-glitter'
export default function DemoOne() {
return (
<Component
speed={0.75}
intensity={5.0}
/>
)
}