diff --git a/src/context/referenceshandler.ts b/src/context/referenceshandler.ts
index 3ae20937..74398445 100644
--- a/src/context/referenceshandler.ts
+++ b/src/context/referenceshandler.ts
@@ -5,10 +5,13 @@ import { RGBColor } from '../utils/rgbcolor'
 export class ReferencesHandler {
   private readonly renderedElements: { [key: string]: SvgNode }
   private readonly idMap: { [id: string]: SvgNode }
+  private readonly idPrefix: string
+  private static instanceCounter = 0
 
   constructor(idMap: { [id: string]: SvgNode }) {
     this.renderedElements = {}
     this.idMap = idMap
+    this.idPrefix = String(ReferencesHandler.instanceCounter++)
   }
 
   public async getRendered(
@@ -16,7 +19,7 @@ export class ReferencesHandler {
     color: RGBColor | null,
     renderCallback: (node: SvgNode) => Promise<void>
   ): Promise<SvgNode> {
-    const key = ReferencesHandler.generateKey(id, color)
+    const key = this.generateKey(id, color)
     if (this.renderedElements.hasOwnProperty(key)) {
       return this.renderedElements[id]
     }
@@ -33,7 +36,7 @@ export class ReferencesHandler {
     return this.idMap[cssEsc(id, { isIdentifier: true })]
   }
 
-  public static generateKey(id: string, color: RGBColor | null): string {
-    return id + '|' + (color || new RGBColor('rgb(0,0,0)')).toRGBA()
+  public generateKey(id: string, color: RGBColor | null): string {
+    return this.idPrefix + '|' + id + '|' + (color || new RGBColor('rgb(0,0,0)')).toRGBA()
   }
 }
diff --git a/src/nodes/use.ts b/src/nodes/use.ts
index d3c97045..2747088a 100644
--- a/src/nodes/use.ts
+++ b/src/nodes/use.ts
@@ -9,7 +9,6 @@ import { SvgNode } from './svgnode'
 import { Symbol } from './symbol'
 import { Viewport } from '../context/viewport'
 import { RGBColor } from '../utils/rgbcolor'
-import { ReferencesHandler } from '../context/referenceshandler'
 
 /**
  * Draws the element referenced by a use node, makes use of pdf's XObjects/FormObjects so nodes are only written once
@@ -86,7 +85,7 @@ export class Use extends GraphicsNode {
       context.pdf.clip().discardPath()
     }
 
-    context.pdf.doFormObject(ReferencesHandler.generateKey(id, color), t)
+    context.pdf.doFormObject(context.refsHandler.generateKey(id, color), t)
     context.pdf.restoreGraphicsState()
   }
 
@@ -112,7 +111,7 @@ export class Use extends GraphicsNode {
     } else {
       await node.render(refContext)
     }
-    refContext.pdf.endFormObject(ReferencesHandler.generateKey(id, color))
+    refContext.pdf.endFormObject(refContext.refsHandler.generateKey(id, color))
   }
 
   protected getBoundingBoxCore(context: Context): number[] {
diff --git a/test/common/tests.js b/test/common/tests.js
index 9b0ce02b..d505b8b1 100644
--- a/test/common/tests.js
+++ b/test/common/tests.js
@@ -17,6 +17,7 @@ window.tests = [
   'complete-social-network',
   'custom-fonts',
   'display-none-and-visibility-inheritance',
+  'duplicate-ids',
   'empty-elements',
   'fill-and-stroke-inheritance',
   'fill-and-stroke-opacity',
diff --git a/test/specs/duplicate-ids/reference.pdf b/test/specs/duplicate-ids/reference.pdf
new file mode 100644
index 00000000..2026d4fe
Binary files /dev/null and b/test/specs/duplicate-ids/reference.pdf differ
diff --git a/test/specs/duplicate-ids/spec.svg b/test/specs/duplicate-ids/spec.svg
new file mode 100644
index 00000000..f54b4727
--- /dev/null
+++ b/test/specs/duplicate-ids/spec.svg
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="500" height="500">
+  <defs>
+    <rect width="100" height="100" id="duplicate" fill="blue"/>
+  </defs>
+
+  <use href="#duplicate" />
+
+  <image y="120" width="100" height="100" href="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3Crect%20width%3D%22100%22%20height%3D%22100%22%20id%3D%22duplicate%22%20fill%3D%22green%22%2F%3E%0A%20%20%3C%2Fdefs%3E%0A%0A%20%20%3Cuse%20href%3D%22%23duplicate%22%20%2F%3E%0A%3C%2Fsvg%3E%0A" />
+</svg>