diff --git a/components/Modal.tsx b/components/Modal.tsx
new file mode 100644
index 00000000..99551e50
--- /dev/null
+++ b/components/Modal.tsx
@@ -0,0 +1,34 @@
+import Swal from "sweetalert2";
+import withReactContent from "sweetalert2-react-content";
+
+export function Modal() {
+  const MySwal = withReactContent(Swal);
+
+  if (typeof window !== 'undefined') {
+    const termsIsConfirmed = localStorage.getItem("termsIsConfirmed");
+
+    if (termsIsConfirmed === "false" || termsIsConfirmed === null) {
+      MySwal.fire({
+        title:
+      `<strong>By proceeding to use the portal, you agree to our
+      <a target="_blank" href="https://www.google.com/"><u>Terms and Conditions</u></strong></a>`,
+        showDenyButton: true,
+        focusConfirm: true,
+        confirmButtonText: "Great!",
+        confirmButtonAriaLabel: "Thumbs up, great!",
+        denyButtonText: "Leave",
+        denyButtonAriaLabel: "Thumbs down",
+        allowOutsideClick: false,
+      }).then((result) => {
+        if (result.isConfirmed) {
+          localStorage.setItem("termsIsConfirmed", "true");
+        } else if (result.isDenied) {
+          localStorage.setItem("termsIsConfirmed", "false");
+          window.close();
+        }
+      });
+    };
+  };
+
+  return null;
+}
\ No newline at end of file
diff --git a/index.mdx b/index.mdx
index ff809d32..5fba4768 100644
--- a/index.mdx
+++ b/index.mdx
@@ -25,10 +25,12 @@ import launchFastIcon from './images/launch-fast.svg';
 import icon3 from './images/icon3.png';
 import bookManagementIcon from './images/book-management.svg';
 import foundOrPrivate from './images/found-or-private.svg';
+import { Modal } from './components/Modal.tsx';
 
 export default LandingLayout;
 
 <Jumbotron>
+  <Modal />
   <NavBar location={props.location} standalone={false} />
   <H1>Redocly training</H1>
   <H2>A starter developer portal with training exercises</H2>
diff --git a/package.json b/package.json
index 1259d570..1fe880d3 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
     "clean": "redocly-portal clean"
   },
   "dependencies": {
-    "@redocly/developer-portal": "1.0.0-beta.82"
+    "@redocly/developer-portal": "1.0.0-beta.82",
+    "sweetalert2": "^10.3.7",
+    "sweetalert2-react-content": "^3.2.0"
   }
 }
diff --git a/yarn.lock b/yarn.lock
index 2546286f..ad0fdfe1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -14920,6 +14920,16 @@ swap-case@^1.1.0:
     lower-case "^1.1.1"
     upper-case "^1.1.1"
 
+sweetalert2-react-content@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/sweetalert2-react-content/-/sweetalert2-react-content-3.2.0.tgz#fbbd219177901ef639b8b685c467e35ff8f28770"
+  integrity sha512-Zd75ZZZh7byFHIppsBl04NrIpqQUyjIazBrCb6NwZIDi7Uv7gbvTGO5+yJqgAzjrY29lXOUOyLmY2riKoc69Pg==
+
+sweetalert2@^10.3.7:
+  version "10.3.7"
+  resolved "https://registry.yarnpkg.com/sweetalert2/-/sweetalert2-10.3.7.tgz#bd68352b980016f52ff0c1a8e96f406c44df731b"
+  integrity sha512-Zp9rolSdH8SnUPhTF31QgK0Vb7HtSjEJ1b4Mw+fbQtCU25I+/P61ahbGNxSAEwLWKVZFvPbOeCr3Yj7NyClh9g==
+
 symbol-observable@^1.0.4, symbol-observable@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"