diff --git a/examples/basic/src/index.ts b/examples/basic/src/index.ts
index fc9dd0f..87d5895 100644
--- a/examples/basic/src/index.ts
+++ b/examples/basic/src/index.ts
@@ -17,6 +17,10 @@ const fireworks = new Fireworks(app, {
 
 // resizeObserver.observe(app)
 
+fireworks.addEventListener('explosion', () => {
+  console.log('One firework just exploded!')
+})
+
 fireworks.start()
 
 const start = el(
diff --git a/packages/fireworks-js/src/fireworks.ts b/packages/fireworks-js/src/fireworks.ts
index 7f52014..c0b0d02 100644
--- a/packages/fireworks-js/src/fireworks.ts
+++ b/packages/fireworks-js/src/fireworks.ts
@@ -27,6 +27,7 @@ export class Fireworks {
   private readonly resize: Resize
   private readonly mouse: Mouse
   private readonly raf: RequestAnimationFrame
+  private readonly events: FireworksTypes.Events = {}
 
   constructor(
     container: Element | HTMLCanvasElement,
@@ -160,6 +161,26 @@ export class Fireworks {
     this.updateOptions({ boundaries })
   }
 
+  addEventListener(
+    type: keyof FireworksTypes.Events,
+    listener: EventListenerOrEventListenerObject,
+    options?: boolean | AddEventListenerOptions
+  ): void {
+    if (!this.events[type]) {
+      this.events[type] = new Event(type)
+    }
+
+    this.canvas.addEventListener(type, listener, options)
+  }
+
+  removeEventListener(
+    type: keyof FireworksTypes.Events,
+    listener: EventListenerOrEventListenerObject,
+    options?: boolean | EventListenerOptions
+  ): void {
+    this.canvas.removeEventListener(type, listener, options)
+  }
+
   private createCanvas(el: Element | HTMLCanvasElement): void {
     if (el instanceof HTMLCanvasElement) {
       if (!el.isConnected) {
@@ -180,6 +201,7 @@ export class Fireworks {
     if (!this.ctx || !this.running) return
 
     const { opacity, lineStyle, lineWidth } = this.opts
+    const tracesStart = this.traces.length
     this.ctx.globalCompositeOperation = 'destination-out'
     this.ctx.fillStyle = `rgba(0, 0, 0, ${opacity})`
     this.ctx.fillRect(0, 0, this.width, this.height)
@@ -191,6 +213,10 @@ export class Fireworks {
     this.initTrace()
     this.drawTrace()
     this.drawExplosion()
+
+    if (tracesStart > this.traces.length && this.events.explosion) {
+      this.canvas.dispatchEvent(this.events.explosion)
+    }
   }
 
   private createTrace(): void {
diff --git a/packages/fireworks-js/src/types.ts b/packages/fireworks-js/src/types.ts
index 83f2cbc..60fc51d 100644
--- a/packages/fireworks-js/src/types.ts
+++ b/packages/fireworks-js/src/types.ts
@@ -87,6 +87,10 @@ export namespace FireworksTypes {
     brightness: MinMax
     decay: MinMax
   }
+
+  export interface Events {
+    explosion?: Event
+  }
 }
 
 export type FireworksOptions = RecursivePartial<FireworksTypes.Options>
@@ -103,6 +107,8 @@ export interface FireworksHandlers
     | 'updateBoundaries'
     | 'updateSize'
     | 'currentOptions'
+    | 'addEventListener'
+    | 'removeEventListener'
   > {
   waitStop(): Promise<void>
   stop(): void
diff --git a/packages/preact/src/index.tsx b/packages/preact/src/index.tsx
index 324f3f1..0200376 100644
--- a/packages/preact/src/index.tsx
+++ b/packages/preact/src/index.tsx
@@ -48,6 +48,12 @@ const Fireworks = React.forwardRef<FireworksHandlers, FireworksProps>(
       },
       updateBoundaries(boundaries) {
         fireworks.current!.updateBoundaries(boundaries)
+      },
+      addEventListener(type, listener, options) {
+        fireworks.current!.addEventListener(type, listener, options)
+      },
+      removeEventListener(type, listener, options) {
+        fireworks.current!.removeEventListener(type, listener, options)
       }
     }))
 
diff --git a/packages/react/src/index.tsx b/packages/react/src/index.tsx
index 1aeda75..58317c6 100644
--- a/packages/react/src/index.tsx
+++ b/packages/react/src/index.tsx
@@ -46,6 +46,12 @@ const Fireworks = React.forwardRef<FireworksHandlers, FireworksProps>(
       },
       updateBoundaries(boundaries) {
         fireworks.current!.updateBoundaries(boundaries)
+      },
+      addEventListener(type, listener, options) {
+        fireworks.current!.addEventListener(type, listener, options)
+      },
+      removeEventListener(type, listener, options) {
+        fireworks.current!.removeEventListener(type, listener, options)
       }
     }))
 
diff --git a/packages/vue/src/fireworks.vue b/packages/vue/src/fireworks.vue
index 2975bde..78d9091 100644
--- a/packages/vue/src/fireworks.vue
+++ b/packages/vue/src/fireworks.vue
@@ -62,6 +62,12 @@ defineExpose<FireworksHandlers>({
   },
   updateBoundaries(boundaries) {
     fireworks.value!.updateBoundaries(boundaries)
+  },
+  addEventListener(type, listener, options) {
+    fireworks.value!.addEventListener(type, listener, options)
+  },
+  removeEventListener(type, listener, options) {
+    fireworks.value!.removeEventListener(type, listener, options)
   }
 })
 </script>