Components
Move your mouse to see the parallax effect
Three layers of stars moving at different speeds
Loading preview...
import { StarsBackground } from '../components/ui/parallax-star';
export const StarsBackgroundDemo = () => {
return (
<div className="w-full h-screen">
<StarsBackground className="absolute inset-0 flex items-center justify-center">
<div className="z-10 text-white text-center px-4">
<h1 className="text-4xl font-bold mb-4">✨ Stars Background Demo</h1>
<p className="text-lg opacity-80 mb-2">Move your mouse to see the parallax effect</p>
<p className="text-sm opacity-60">Three layers of stars moving at different speeds</p>
</div>
</StarsBackground>
</div>
);
};
export default StarsBackgroundDemo;Loading preview...