←Back to Gallery
hoverambient§38
Static
TV static, white noise, signal lost
The Exhibit
Technique
Hash-based random on all 3 axes
Blueprint
tsx
<ParticleText
text="UI Lab"
hoverMode="static"
particleCount={8000}
cursorRadius={120}
falloff="gaussian"
/>How to Use
1. Install dependencies
bash
# Install
pnpm add three
# Copy these files to your project:
# src/lib/particle-sampler.ts
# src/lib/glsl-effects.ts
# src/components/particle-text.tsx
# Then import and use:
import { ParticleText } from "@/components/particle-text";2. Use in your component
tsx
"use client";
import { ParticleText } from "@/components/particle-text";
export function MyComponent() {
return (
<div className="h-64 w-full">
<ParticleText
text="Hello World"
hoverMode="static"
particleCount={8000}
cursorRadius={120}
color={[0.6, 0.75, 0.9]}
glowColor={[0.95, 0.75, 0.3]}
opacity={0.9}
/>
</div>
);
}