diff --git a/src/components/WorkInProgress.tsx b/src/components/WorkInProgress.tsx
new file mode 100644
index 0000000..b129808
--- /dev/null
+++ b/src/components/WorkInProgress.tsx
@@ -0,0 +1,17 @@
+import type {FunctionComponent} from "react";
+
+const WorkInProgress: FunctionComponent = () => {
+    return <div className="w-full my-10 flex justify-center">
+        <div
+            className="bg-zinc-850 border border-zinc-700 rounded-md max-w-screen-md w-full m-1 p-5 flex flex-col items-center justify-center">
+            <p className="font-semibold text-3xl sm:text-4xl pb-2">Work In Progress</p>
+            <p className="text-lg text-center">
+                This website is a work-in progress.
+                <br/>
+                Unfortunately, this page hasn&apos;t been finished yet. Check back later.
+        </p>
+        </div>
+    </div>
+}
+
+export default WorkInProgress;
\ No newline at end of file
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
index 67a18f5..d2fda70 100644
--- a/src/pages/contact.tsx
+++ b/src/pages/contact.tsx
@@ -1,8 +1,10 @@
-import {NextPage} from "next";
+import {type NextPage} from "next";
 import AppWrapper from "../components/AppWrapper";
+import WorkInProgress from "../components/WorkInProgress";
 
 const ContactPage: NextPage = () => {
     return <AppWrapper>
+        <WorkInProgress />
     </AppWrapper>
 }
 
diff --git a/src/pages/projects.tsx b/src/pages/projects.tsx
index e7aa2dc..aad525b 100644
--- a/src/pages/projects.tsx
+++ b/src/pages/projects.tsx
@@ -1,8 +1,11 @@
-import {NextPage} from "next";
+import {type NextPage} from "next";
 import AppWrapper from "../components/AppWrapper";
+import WorkInProgress from "../components/WorkInProgress";
 
 const ProjectsPage: NextPage = () => {
-    return <AppWrapper />;
+    return <AppWrapper>
+        <WorkInProgress/>
+    </AppWrapper>;
 }
 
 export default ProjectsPage;
\ No newline at end of file