diff --git a/src/calendar-app/calendar/view/CalendarMonthView.ts b/src/calendar-app/calendar/view/CalendarMonthView.ts
index 919fb9cfaca7..8eb250f7f0b7 100644
--- a/src/calendar-app/calendar/view/CalendarMonthView.ts
+++ b/src/calendar-app/calendar/view/CalendarMonthView.ts
@@ -277,7 +277,18 @@ export class CalendarMonthView implements Component<CalendarMonthAttrs>, ClassCo
 				this.renderDayHeader(day, attrs.onDateSelected), // According to ISO 8601, weeks always start on Monday. Week numbering systems for
 				// weeks that do not start on Monday are not strictly defined, so we only display
 				// a week number if the user's client is configured to start weeks on Monday
-				weekDayNumber === 0 && attrs.startOfTheWeek === WeekStart.MONDAY ? m(".calendar-month-week-number.abs", getWeekNumber(day.date)) : null,
+				weekDayNumber === 0 && attrs.startOfTheWeek === WeekStart.MONDAY
+					? m(
+							".calendar-month-week-number.abs.z3",
+							{
+								onclick: (e: MouseEvent) => {
+									e.stopPropagation()
+									attrs.onDateSelected(new Date(day.date), CalendarViewType.WEEK)
+								},
+							},
+							getWeekNumber(day.date),
+					  )
+					: null,
 			],
 		)
 	}
diff --git a/src/common/gui/main-styles.ts b/src/common/gui/main-styles.ts
index 38d0312a0448..4d7552729922 100644
--- a/src/common/gui/main-styles.ts
+++ b/src/common/gui/main-styles.ts
@@ -2247,6 +2247,17 @@ styles.registerStyle("main", () => {
 			top: "8px",
 			left: "6px",
 		},
+		".calendar-month-week-number:after": {
+			// Used to expand the clickable area
+			content: "''",
+			width: "100%",
+			height: "100%",
+			position: "absolute",
+			top: "0",
+			left: "0",
+			padding: "35%",
+			margin: "-35% -35%",
+		},
 		".color-picker": {
 			height: px(30),
 			width: px(100),