diff --git a/docs/developers/destroy_flowchart.png b/docs/developers/destroy_flowchart.png
new file mode 100644
index 00000000000..c8d5cbab51e
Binary files /dev/null and b/docs/developers/destroy_flowchart.png differ
diff --git a/docs/developers/plugins.md b/docs/developers/plugins.md
index 64efe2096ba..e24cc9d82d2 100644
--- a/docs/developers/plugins.md
+++ b/docs/developers/plugins.md
@@ -147,3 +147,10 @@ Plugins can interact with the chart throughout the render process. The rendering
 Plugins can interact with the chart during the event handling process. The event handling flow is documented in the flowchart below. Each of the green processes is a plugin notification. If a plugin makes changes that require a re-render, the plugin can set `args.changed` to `true` to indicate that a render is needed. The built-in tooltip plugin uses this method to indicate when the tooltip has changed.
 
 ![Chart.js event handling flowchart](./event_flowchart.png)
+
+### Chart destroy
+
+Plugins are notified during the destroy process. These hooks can be used to destroy things that the plugin made and used during its life.
+The `destroy` hook has been deprecated since Chart.js version 3.7.0, use the `afterDestroy` hook instead.
+
+![Chart.js destroy flowchart](./destroy_flowchart.png)
diff --git a/src/core/core.controller.js b/src/core/core.controller.js
index e7621f8c915..01fcd0975ca 100644
--- a/src/core/core.controller.js
+++ b/src/core/core.controller.js
@@ -891,6 +891,7 @@ class Chart {
   }
 
   destroy() {
+    this.notifyPlugins('beforeDestroy');
     const {canvas, ctx} = this;
 
     this._stop();
@@ -904,9 +905,12 @@ class Chart {
       this.ctx = null;
     }
 
+    // TODO V4: delete destroy hook and reference to it in plugin flowchart
     this.notifyPlugins('destroy');
 
     delete instances[this.id];
+
+    this.notifyPlugins('afterDestroy');
   }
 
   toBase64Image(...args) {
diff --git a/src/core/core.plugins.js b/src/core/core.plugins.js
index 480f4239133..27a07bb0c91 100644
--- a/src/core/core.plugins.js
+++ b/src/core/core.plugins.js
@@ -41,7 +41,7 @@ export default class PluginService {
     const descriptors = filter ? this._descriptors(chart).filter(filter) : this._descriptors(chart);
     const result = this._notify(descriptors, chart, hook, args);
 
-    if (hook === 'destroy') {
+    if (hook === 'afterDestroy') {
       this._notify(descriptors, chart, 'stop');
       this._notify(this._init, chart, 'uninstall');
     }
diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts
index cb02b1c91aa..d848b54d17b 100644
--- a/types/index.esm.d.ts
+++ b/types/index.esm.d.ts
@@ -1053,13 +1053,28 @@ export interface Plugin<TType extends ChartType = ChartType, O = AnyObject> exte
    * @param {object} options - The plugin options.
    */
   resize?(chart: Chart, args: { size: { width: number, height: number } }, options: O): void;
+  /**
+   * Called before the chart is being destroyed.
+   * @param {Chart} chart - The chart instance.
+   * @param {object} args - The call arguments.
+   * @param {object} options - The plugin options.
+   */
+  beforeDestroy?(chart: Chart, args: EmptyObject, options: O): void;
   /**
    * Called after the chart has been destroyed.
    * @param {Chart} chart - The chart instance.
    * @param {object} args - The call arguments.
    * @param {object} options - The plugin options.
+   * @deprecated since version 3.7.0 in favour of afterDestroy
    */
   destroy?(chart: Chart, args: EmptyObject, options: O): void;
+  /**
+   * Called after the chart has been destroyed.
+   * @param {Chart} chart - The chart instance.
+   * @param {object} args - The call arguments.
+   * @param {object} options - The plugin options.
+   */
+  afterDestroy?(chart: Chart, args: EmptyObject, options: O): void;
   /**
    * Called after chart is destroyed on all plugins that were installed for that chart. This hook is also invoked for disabled plugins (options === false).
    * @param {Chart} chart - The chart instance.