diff --git a/src/components/ArtistSpotlight/ArtistParticles.jsx b/src/components/ArtistSpotlight/ArtistParticles.jsx
new file mode 100644
index 0000000..cdcc4a1
--- /dev/null
+++ b/src/components/ArtistSpotlight/ArtistParticles.jsx
@@ -0,0 +1,51 @@
+import { useRef, useMemo } from 'react'
+import { Canvas, useFrame } from '@react-three/fiber'
+import * as THREE from 'three'
+
+const COUNT = 280
+
+function Particles() {
+ const meshRef = useRef()
+ const dummy = useMemo(() => new THREE.Object3D(), [])
+
+ const data = useMemo(() => {
+ return Array.from({ length: COUNT }, (_, i) => ({
+ phi: Math.acos(-1 + (2 * i) / COUNT),
+ theta: Math.sqrt(COUNT * Math.PI) * (2 * i / COUNT) * Math.PI,
+ speed: 0.15 + Math.random() * 0.25,
+ radius: 2.2 + Math.random() * 1.4,
+ }))
+ }, [])
+
+ useFrame(({ clock }) => {
+ if (!meshRef.current) return
+ const t = clock.getElapsedTime()
+ data.forEach((p, i) => {
+ const r = p.radius + Math.sin(t * p.speed + i * 0.3) * 0.25
+ dummy.position.set(
+ r * Math.sin(p.phi) * Math.cos(p.theta + t * p.speed * 0.08),
+ r * Math.cos(p.phi),
+ r * Math.sin(p.phi) * Math.sin(p.theta + t * p.speed * 0.08),
+ )
+ dummy.scale.setScalar(0.012 + Math.abs(Math.sin(t * 0.5 + i)) * 0.008)
+ dummy.updateMatrix()
+ meshRef.current.setMatrixAt(i, dummy.matrix)
+ })
+ meshRef.current.instanceMatrix.needsUpdate = true
+ })
+
+ return (
+
+
+
+
+ )
+}
+
+export default function ArtistParticles() {
+ return (
+
+ )
+}