diff --git a/packages/webamp/js/webampWithButterchurn.ts b/packages/webamp/js/webampWithButterchurn.ts
new file mode 100644
index 00000000..ebb1178e
--- /dev/null
+++ b/packages/webamp/js/webampWithButterchurn.ts
@@ -0,0 +1,31 @@
+import { Options } from "./types";
+import { PrivateOptions } from "./webampLazy";
+import Webamp from "./webamp";
+import "butterchurn/dist/butterchurn.min.js"; // buterchurn@3.0.0-beta.4
+import "butterchurn-presets/dist/base.js"; // butterchurn-presets@3.0.0-beta.4
+
+// @ts-ignore
+const butterchurn = window.butterchurn;
+// @ts-ignore
+const butterchurnPresets = window.base.default;
+
+export default class WebampWithButterchurn extends Webamp {
+  constructor(options: Options & PrivateOptions) {
+    super({
+      ...options,
+      __butterchurnOptions: {
+        importButterchurn: () => Promise.resolve(butterchurn),
+        // @ts-ignore
+        getPresets: () => {
+          return Object.entries(butterchurnPresets).map(([name, preset]) => {
+            return { name, butterchurnPresetObject: preset };
+          });
+        },
+      },
+    });
+  }
+}
+
+// Bit of a hack here. This overwrites the value set in Webamp.ts and WebampLazy.ts
+// @ts-ignore
+window.Webamp = Webamp;
diff --git a/packages/webamp/package.json b/packages/webamp/package.json
index 20afeae2..c157ecc1 100644
--- a/packages/webamp/package.json
+++ b/packages/webamp/package.json
@@ -23,6 +23,11 @@
       "types": "./built/types/js/webamp.d.ts",
       "default": "./built/webamp.bundle.min.mjs"
     },
+    "./butterchurn": {
+      "import": "./built/webamp.butterchurn-bundle.min.mjs",
+      "types": "./built/types/js/butterchurn.d.ts",
+      "default": "./built/webamp.butterchurn-bundle.min.mjs"
+    },
     "./lazy": {
       "require": "./built/webamp.lazy-bundle.js",
       "import": "./built/webamp.lazy-bundle.min.mjs",
diff --git a/packages/webamp/scripts/rollup.mjs b/packages/webamp/scripts/rollup.mjs
index e8560ad0..5323aff4 100644
--- a/packages/webamp/scripts/rollup.mjs
+++ b/packages/webamp/scripts/rollup.mjs
@@ -74,6 +74,18 @@ const BUNDLES = [
       inlineDynamicImports: true,
     },
   },
+  {
+    name: "Webamp Butterchurn ES",
+    input: "js/webampWithButterchurn.ts",
+    minify: true,
+    output: {
+      file: "built/webamp.butterchurn-bundle.min.mjs",
+      format: "module",
+      // music-metadata uses dynamic imports, so we need to inline them
+      // to avoid issues with the UMD build.
+      inlineDynamicImports: true,
+    },
+  },
 ];
 
 build();