diff --git a/web/invite-links/accept-invite-modal.css b/web/invite-links/accept-invite-modal.css
new file mode 100644
--- /dev/null
+++ b/web/invite-links/accept-invite-modal.css
@@ -0,0 +1,39 @@
+.container {
+  border-radius: 16px;
+  padding: 32px 24px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  text-align: center;
+  background: var(--modal-bg);
+  width: 398px;
+  gap: 32px;
+}
+
+.group {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+}
+
+.heading {
+  font-size: var(--xl-font-20);
+  line-height: var(--line-height-display);
+  font-weight: var(--semi-bold);
+  color: var(--fg);
+}
+
+.text {
+  font-size: var(--s-font-14);
+  color: var(--label-default-color);
+}
+
+hr {
+  width: 100%;
+  background: var(--border);
+}
+
+button {
+  width: 100%;
+}
diff --git a/web/invite-links/accept-invite-modal.react.js b/web/invite-links/accept-invite-modal.react.js
new file mode 100644
--- /dev/null
+++ b/web/invite-links/accept-invite-modal.react.js
@@ -0,0 +1,73 @@
+// @flow
+
+import * as React from 'react';
+
+import ModalOverlay from 'lib/components/modal-overlay.react.js';
+import { useModalContext } from 'lib/components/modal-provider.react.js';
+import { type InviteLinkVerificationResponse } from 'lib/types/link-types.js';
+
+import css from './accept-invite-modal.css';
+import Button, { buttonThemes } from '../components/button.react.js';
+
+type Props = {
+  +verificationResponse: InviteLinkVerificationResponse,
+};
+
+function AcceptInviteModal(props: Props): React.Node {
+  const { verificationResponse } = props;
+  const { popModal } = useModalContext();
+
+  React.useEffect(() => {
+    if (verificationResponse.status === 'already_joined') {
+      popModal();
+    }
+  }, [popModal, verificationResponse.status]);
+
+  let content;
+  if (verificationResponse.status === 'valid') {
+    const { community } = verificationResponse;
+    content = (
+      <>
+        <div className={css.text}>You have been invited to join</div>
+        <div className={css.heading}>{community.name}</div>
+        <hr />
+        <div className={css.group}>
+          <Button variant="filled" buttonColor={buttonThemes.standard}>
+            Accept Invite
+          </Button>
+          <Button variant="outline" onClick={popModal}>
+            Cancel
+          </Button>
+        </div>
+      </>
+    );
+  } else {
+    content = (
+      <>
+        <div className={css.group}>
+          <div className={css.heading}>Invite invalid</div>
+          <div className={css.text}>
+            This invite link may be expired, please try again with another
+            invite link
+          </div>
+        </div>
+        <hr />
+        <Button
+          variant="filled"
+          buttonColor={buttonThemes.standard}
+          onClick={popModal}
+        >
+          Return to Comm
+        </Button>
+      </>
+    );
+  }
+
+  return (
+    <ModalOverlay onClose={popModal}>
+      <div className={css.container}>{content}</div>
+    </ModalOverlay>
+  );
+}
+
+export default AcceptInviteModal;