diff --git a/build.gradle b/build.gradle
index df03d62..af2d690 100644
--- a/build.gradle
+++ b/build.gradle
@@ -5,7 +5,7 @@ plugins {
 }
 
 group = 'de.jottyfan'
-version = '1.2.7'
+version = '1.2.8'
 sourceCompatibility = '11'
 
 ext['spring-framework.version'] = '5.3.18'
@@ -25,21 +25,22 @@ repositories {
 
 dependencyManagement {
   imports {
-    mavenBom 'org.keycloak.bom:keycloak-adapter-bom:17.0.1'
+    mavenBom 'org.keycloak.bom:keycloak-adapter-bom:21.1.1'
   }
 }
 
 dependencies {
-	implementation 'org.apache.logging.log4j:log4j-api:2.17.1'
-	implementation 'org.apache.logging.log4j:log4j-core:2.17.1'
-	implementation 'org.apache.logging.log4j:log4j-to-slf4j:2.17.1'
+	implementation 'org.apache.logging.log4j:log4j-api:2.20.0'
+	implementation 'org.apache.logging.log4j:log4j-core:2.20.0'
+	implementation 'org.apache.logging.log4j:log4j-to-slf4j:2.20.0'
 
-	implementation 'org.webjars:bootstrap:5.1.3'
+	implementation 'org.webjars:bootstrap:5.2.3'
 	implementation 'org.webjars:font-awesome:5.15.4'
-	implementation 'org.webjars:jquery:3.6.0'
+	implementation 'org.webjars:jquery:3.6.4'
 	implementation 'org.webjars:popper.js:2.9.3'
-	implementation 'org.webjars:datatables:1.11.3'
-  implementation 'org.webjars:jquery-ui:1.13.0'
+	implementation 'org.webjars:datatables:1.13.2'
+  implementation 'org.webjars:jquery-ui:1.13.2'
+  implementation 'org.webjars:fullcalendar:5.11.3'
   
   implementation 'com.google.code.gson:gson:2.9.0';
 	
diff --git a/src/main/java/de/jottyfan/timetrack/spring/calendar/CalendarController.java b/src/main/java/de/jottyfan/timetrack/spring/calendar/CalendarController.java
new file mode 100644
index 0000000..0e6982c
--- /dev/null
+++ b/src/main/java/de/jottyfan/timetrack/spring/calendar/CalendarController.java
@@ -0,0 +1,20 @@
+package de.jottyfan.timetrack.spring.calendar;
+
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+
+/**
+ * 
+ * @author jotty
+ *
+ */
+@Controller
+public class CalendarController {
+	
+	@GetMapping("/calendar")
+	public String getCalendar(Model model) {
+		// TODO: implement
+		return "/calendar/calendar";
+	}
+}
diff --git a/src/main/resources/static/css/style.css b/src/main/resources/static/css/style.css
index b63c899..b63ee80 100644
--- a/src/main/resources/static/css/style.css
+++ b/src/main/resources/static/css/style.css
@@ -246,6 +246,13 @@ body {
 	border: 1px solid silver;
 }
 
+.tab-pane-glassy {
+	background: rgba(255, 255, 255, 0.5);
+	padding: 8px;
+	border-radius: 4px;
+	border: 1px solid silver;
+}
+
 .inputtimefield {
 	min-width: 70px !important;
 }
diff --git a/src/main/resources/templates/calendar/calendar.html b/src/main/resources/templates/calendar/calendar.html
new file mode 100644
index 0000000..f761b2b
--- /dev/null
+++ b/src/main/resources/templates/calendar/calendar.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:sec="http://www.thymeleaf.org/extras/spring-security" layout:decorate="~{layout/main.html}">
+<head>
+<title>Kalender</title>
+</head>
+<body>
+	<font layout:fragment="title">Kalender</font>
+	<ul layout:fragment="menu">
+		<li class="nav-item" sec:authorize="hasRole('timetrack_user')"><a class="nav-link btn btn-outline-success" th:href="@{/calendar/add}">Neuen Termin anlegen</a></li>
+	</ul>
+	<main layout:fragment="content">
+		<ul class="nav nav-tabs navback" role="tablist">
+			<li class="nav-item"><a class="nav-link navlinkstyle active" data-bs-toggle="tab" href="#div_dashboard">Kalender</a></li>
+			<li class="nav-item"><a class="nav-link navlinkstyle" data-bs-toggle="tab" href="#div_options">Einstellungen</a></li>
+		</ul>
+		<div class="tabdivblurred tab-content">
+			<div id="div_dashboard" class="tab-pane active tab-pane-glassy">
+				<div sec:authorize="hasRole('timetrack_user')">
+					<div id="calendar"></div>
+					<script type="text/javascript">
+						$(document).ready(function() {
+							var the_events = [ { id: 'example1', title: 'überlappend', start: '2023-05-08T08:00:00.000Z', end: '2023-05-09T08:00:00.000Z'},
+								                 { id: 'example2', title: 'der ganze Tag', allDay: true, start: '2023-05-08', backgroundColor: '#aa77aa'},
+								               ];
+							
+							var the_div = document.getElementById('calendar');
+							var c = new FullCalendar.Calendar(the_div, {
+								initialView: 'timeGridWeek',
+								events: the_events,
+								dateClick: function(info) {
+									alert('Clicked on: ' + info.dateStr);
+									// TODO: call /calendar/add/{d}(d='info.dateStr')
+								},
+								eventClick: function(info) {
+									alert('Clicked on event: ' + info.event.title);
+									// TODO: call /calendar/edit/{d}(d='info.dateStr')
+								},
+								height: 800
+							});
+							c.setOption('locale', 'de');
+							c.addEvent( { id: 'example3', title: 'added after init', start: '2023-05-08', allDay: true, backgroundColor: 'darkcyan'} );
+							c.render();
+						});
+					</script>
+				</div>
+			</div>
+			<div id="div_options" class="tab-pane fade tab-pane-table">
+				<div sec:authorize="hasRole('timetrack_user')">
+					<!-- TODO: add the options here -->
+				</div>
+			</div>
+		</div>
+	</main>
+</body>
+</html>
\ No newline at end of file
diff --git a/src/main/resources/templates/layout/main.html b/src/main/resources/templates/layout/main.html
index b60d504..accd462 100644
--- a/src/main/resources/templates/layout/main.html
+++ b/src/main/resources/templates/layout/main.html
@@ -5,17 +5,19 @@
 
 <title>Timetrack</title>
 
-<link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/5.1.3/css/bootstrap.min.css}" />
-<link rel="stylesheet" type="text/css" th:href="@{/webjars/datatables/1.11.3/css/dataTables.bootstrap5.min.css}" />
+<link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/5.2.3/css/bootstrap.min.css}" />
+<link rel="stylesheet" type="text/css" th:href="@{/webjars/datatables/1.13.2/css/dataTables.bootstrap5.min.css}" />
 <link rel="stylesheet" type="text/css" th:href="@{/webjars/font-awesome/5.15.4/css/all.min.css}" />
+<link rel="stylesheet" type="text/css" th:href="@{/webjars/fullcalendar/5.11.3/main.css}" />
 <link rel="stylesheet" type="text/css" th:href="@{/css/style.css}">
 <link rel="icon" type="image/png" sizes="32x32" th:href="@{/png/favicon/favicon-32x32.png}" />
 <link rel="icon" type="image/png" sizes="16x16" th:href="@{/png/favicon/favicon-16x16.png}" />
 
-<script th:src="@{/webjars/jquery/3.6.0/jquery.min.js}"></script>
-<script th:src="@{/webjars/bootstrap/5.1.3/js/bootstrap.bundle.min.js}"></script>
-<script th:src="@{/webjars/datatables/1.11.3/js/jquery.dataTables.min.js}"></script>
-<script th:src="@{/webjars/datatables/1.11.3/js/dataTables.bootstrap5.min.js}"></script>
+<script th:src="@{/webjars/jquery/3.6.4/jquery.min.js}"></script>
+<script th:src="@{/webjars/bootstrap/5.2.3/js/bootstrap.bundle.min.js}"></script>
+<script th:src="@{/webjars/datatables/1.13.2/js/jquery.dataTables.min.js}"></script>
+<script th:src="@{/webjars/datatables/1.13.2/js/dataTables.bootstrap5.min.js}"></script>
+<script th:src="@{/webjars/fullcalendar/5.11.3/main.js}"></script>
 <script th:src="@{/js/helper.js}"></script>
 <script th:src="@{/js/clock.js}"></script>
 <script th:src="@{/js/schedule.js}"></script>
@@ -38,6 +40,7 @@
 							<li><a class="dropdown-item" th:href="@{/done/list}">Arbeitszeit</a></li>
 							<li><a class="dropdown-item" th:href="@{/contact/list}">Kontakte</a></li>
 							<li><a class="dropdown-item" th:href="@{/note/list}">Notizen</a></li>
+							<li><a class="dropdown-item" th:href="@{/calendar}">Kalender</a></li>
 							<li><hr /></li>
 							<li><a class="dropdown-item" th:href="@{/logout}">[[${currentUser}]] abmelden</a></li>
 						</ul></li>
