diff --git a/landing/download.css b/landing/download.css
new file mode 100644
--- /dev/null
+++ b/landing/download.css
@@ -0,0 +1,37 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 72px 0 128px;
+}
+
+.heading {
+  color: var(--white-80);
+  margin-bottom: 48px;
+}
+
+.subheading {
+  max-width: 60ch;
+  margin: 0 auto;
+  padding: 0 32px 40px 32px;
+  color: var(--white-80);
+  text-align: center;
+}
+
+.platfromHeader {
+  margin: 32px 0 8px;
+}
+
+.buttonsContainer {
+  display: flex;
+  column-gap: 16px;
+  width: 280px;
+}
+
+.buttonContentContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  column-gap: 8px;
+  padding: 4px 0;
+}
diff --git a/landing/download.react.js b/landing/download.react.js
new file mode 100644
--- /dev/null
+++ b/landing/download.react.js
@@ -0,0 +1,96 @@
+// @flow
+
+import {
+  faAppStoreIos,
+  faGooglePlay,
+  faApple,
+  faWindows,
+} from '@fortawesome/free-brands-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import classNames from 'classnames';
+import * as React from 'react';
+
+import Button from './button.react.js';
+import css from './download.css';
+import typography from './typography.css';
+
+const onClickiOS = () => {
+  window.open(
+    'https://apps.apple.com/us/app/comm-messenger/id1574433435',
+    '_blank',
+  );
+};
+
+const onClickAndroid = () => {
+  window.open(
+    'https://play.google.com/store/apps/details?id=app.comm.android',
+    '_blank',
+  );
+};
+
+const onClickMacOS = () => {
+  window.open(
+    'https://electron-update.commtechnologies.org/download/dmg',
+    '_blank',
+  );
+};
+
+const onClickWindows = () => {
+  window.open(
+    'https://electron-update.commtechnologies.org/download/windows',
+    '_blank',
+  );
+};
+
+function Download(): React.Node {
+  const headerClassName = classNames([typography.heading1, css.heading]);
+  const subheaderClassName = classNames([
+    typography.subheading2,
+    css.subheading,
+  ]);
+  const platformHeaderTextClassName = classNames([
+    typography.heading4,
+    css.platfromHeader,
+  ]);
+
+  return (
+    <div className={css.container}>
+      <h1 className={headerClassName}>Download Comm</h1>
+      <h2 className={subheaderClassName}>
+        Note that account creation is only possible on mobile.
+      </h2>
+      <p className={platformHeaderTextClassName}>Mobile</p>
+      <div className={css.buttonsContainer}>
+        <Button onClick={onClickiOS}>
+          <div className={css.buttonContentContainer}>
+            <FontAwesomeIcon icon={faAppStoreIos} size="lg" />
+            <div className={typography.paragraph1}>iOS</div>
+          </div>
+        </Button>
+        <Button onClick={onClickAndroid}>
+          <div className={css.buttonContentContainer}>
+            <FontAwesomeIcon icon={faGooglePlay} size="lg" />
+            <div className={typography.paragraph1}>Android</div>
+          </div>
+        </Button>
+      </div>
+      <p className={platformHeaderTextClassName}>Desktop</p>
+      <div className={css.buttonsContainer}>
+        <Button onClick={onClickMacOS}>
+          <div className={css.buttonContentContainer}>
+            <FontAwesomeIcon icon={faApple} size="lg" />
+            <div className={typography.paragraph1}>macOS</div>
+          </div>
+        </Button>
+        <Button onClick={onClickWindows}>
+          <div className={css.buttonContentContainer}>
+            <FontAwesomeIcon icon={faWindows} size="lg" />
+            <div className={typography.paragraph1}>Windows</div>
+          </div>
+        </Button>
+      </div>
+    </div>
+  );
+}
+
+export default Download;