diff --git a/src/components/button/DownloadMuseHubButton.jsx b/src/components/button/DownloadMuseHubButton.jsx
new file mode 100644
index 0000000..acd1dc6
--- /dev/null
+++ b/src/components/button/DownloadMuseHubButton.jsx
@@ -0,0 +1,43 @@
+import React, { useEffect, useState } from "react";
+import platform from "platform";
+
+function DownloadMuseHubButton(props) {
+ const [browserOS, setBrowserOS] = useState("");
+
+ useEffect(() => {
+ setBrowserOS(platform.os.family);
+ }, []);
+
+ function renderButton(href) {
+ return (
+
+ Download with free effects and samples
+
+ );
+ }
+
+ switch (browserOS) {
+ case "OS X":
+ return renderButton(
+ "https://pub-c7a32e5b5d834ec9aeef400105452a42.r2.dev/Muse_Hub.dmg"
+ );
+ break;
+ case "Windows":
+ return renderButton(
+ "https://pub-c7a32e5b5d834ec9aeef400105452a42.r2.dev/Muse_Hub.exe"
+ );
+ break;
+ case "Linux":
+ return renderButton(
+ "https://pub-c7a32e5b5d834ec9aeef400105452a42.r2.dev/Muse_Hub.deb"
+ );
+ break;
+ default:
+ return renderButton("/downloads", "Download Audacity");
+ }
+}
+
+export default DownloadMuseHubButton;
diff --git a/src/components/homepage/HeroBanner.astro b/src/components/homepage/HeroBanner.astro
index f2e4345..e231115 100644
--- a/src/components/homepage/HeroBanner.astro
+++ b/src/components/homepage/HeroBanner.astro
@@ -1,6 +1,7 @@
---
import DownloadButton from "../button/DownloadButton";
import Audacity_Logo from "../../assets/img/Audacity_Logo.png";
+import DownloadMuseHubButton from "../button/DownloadMuseHubButton";
---
@@ -18,10 +19,7 @@ import Audacity_Logo from "../../assets/img/Audacity_Logo.png";