diff --git a/client/src/pages/BoatOverview.tsx b/client/src/pages/BoatOverview.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a165e189dcab019bb78b9a67ab5970fb0ae56d95
--- /dev/null
+++ b/client/src/pages/BoatOverview.tsx
@@ -0,0 +1,29 @@
+import { Button } from "react-bootstrap";
+import { useTranslation } from "react-i18next";
+import Divider from "../components/Divider";
+import RentedBoatTile from "../components/RentedBoatTile";
+
+
+function BoatOverview() {
+	const {t} = useTranslation();
+	return (
+		<div className="text-center">
+			{/*TODO: Make dynamic*/}
+			<h1 className="mt-3">{t("boatOverview.labelOverdue")}</h1>
+			<div className="row mx-auto w-100 justify-content-center">
+				<RentedBoatTile boatName="Canoe 13" time="13:15-15:14" persons="1 Person" overdue="Overdue!"></RentedBoatTile>
+				<RentedBoatTile boatName="Canoe 15" time="13:15-15:14" persons="3 Person" overdue="Overdue!"></RentedBoatTile>
+				<RentedBoatTile boatName="Canoe 15" time="13:15-15:14" persons="3 Person" overdue="Overdue!"></RentedBoatTile>
+				<RentedBoatTile boatName="Canoe 15" time="13:15-15:14" persons="3 Person" overdue="Overdue!"></RentedBoatTile>
+				<RentedBoatTile boatName="Canoe 15" time="13:15-15:14" persons="3 Person" overdue="Overdue!"></RentedBoatTile>
+				<RentedBoatTile boatName="Canoe 15" time="13:15-15:14" persons="3 Person" overdue="Overdue!"></RentedBoatTile>
+			</div>
+			<Button variant="light" className="color-secondary border w-50 text-uppercase rounded-pill">{t("boatOverview.buttonShowAll")}</Button>
+			<Divider />
+			<h1 className="mt-3">{t("boatOverview.labelCurrentlyRented")}</h1>
+			<Button variant="light" className="color-secondary border w-50 text-uppercase rounded-pill">{t("boatOverview.buttonShowAll")}</Button>
+		</div>
+	);
+}
+
+export default BoatOverview;
\ No newline at end of file