diff --git a/WidgetExtension/ContinueLearningWidget.swift b/WidgetExtension/ContinueLearningWidget.swift
index 7a9b741da..f63ceaebc 100644
--- a/WidgetExtension/ContinueLearningWidget.swift
+++ b/WidgetExtension/ContinueLearningWidget.swift
@@ -10,14 +10,17 @@ struct ContinueLearningWidgetEntryView: View {
     var entry: ContinueLearningWidgetProvider.Entry
 
     var body: some View {
-        if !entry.userIsLoggedIn {
-            EmptyStateView.notLoggedIn
-        } else if let course = entry.course {
-            CourseView(course: course)
-                .padding()
-        } else {
-            EmptyStateView.noCourses
+        Group {
+            if !entry.userIsLoggedIn {
+                EmptyStateView.notLoggedIn
+            } else if let course = entry.course {
+                CourseView(course: course)
+                    .backport.widgetPadding()
+            } else {
+                EmptyStateView.noCourses
+            }
         }
+        .backport.widgetBackground()
     }
 }
 
diff --git a/WidgetExtension/CourseDateOverviewWidget.swift b/WidgetExtension/CourseDateOverviewWidget.swift
index 2afe59d2b..485df8dba 100644
--- a/WidgetExtension/CourseDateOverviewWidget.swift
+++ b/WidgetExtension/CourseDateOverviewWidget.swift
@@ -10,20 +10,23 @@ struct CourseDateOverviewWidgetEntryView: View {
     var entry: CourseDateOverviewWidgetProvider.Entry
 
     var body: some View {
-        if !entry.userIsLoggedIn {
-            EmptyStateView.notLoggedIn
-        } else if let courseDate = entry.nextCourseDate {
-            HStack {
-                CourseDateStatisticsView(courseDateStatistics: entry.courseDateStatistics)
-                Divider()
-                    .padding(.horizontal, 4) // todo change to vertical
-                CourseDateView(courseDate: courseDate)
-                    .widgetURL(courseDate.url)
+        Group {
+            if !entry.userIsLoggedIn {
+                EmptyStateView.notLoggedIn
+            } else if let courseDate = entry.nextCourseDate {
+                HStack {
+                    CourseDateStatisticsView(courseDateStatistics: entry.courseDateStatistics)
+                    Divider()
+                        .padding(.horizontal, 4) // todo change to vertical
+                    CourseDateView(courseDate: courseDate)
+                        .widgetURL(courseDate.url)
+                }
+                .backport.widgetPadding()
+            } else {
+                EmptyStateView.noCourseDates
             }
-            .padding()
-        } else {
-            EmptyStateView.noCourseDates
         }
+        .backport.widgetBackground()
     }
 }
 
diff --git a/WidgetExtension/CourseDateStatisticsWidget.swift b/WidgetExtension/CourseDateStatisticsWidget.swift
index a30b19fff..db023215a 100644
--- a/WidgetExtension/CourseDateStatisticsWidget.swift
+++ b/WidgetExtension/CourseDateStatisticsWidget.swift
@@ -10,14 +10,17 @@ struct CourseDateStatisticsWidgetEntryView: View {
     var entry: CourseDateOverviewWidgetProvider.Entry
 
     var body: some View {
-        if !entry.userIsLoggedIn {
-            EmptyStateView.notLoggedIn
-        } else if entry.nextCourseDate != nil {
-            CourseDateStatisticsView(courseDateStatistics: entry.courseDateStatistics)
-                .padding()
-        } else {
-            EmptyStateView.noCourseDates
+        Group {
+            if !entry.userIsLoggedIn {
+                EmptyStateView.notLoggedIn
+            } else if entry.nextCourseDate != nil {
+                CourseDateStatisticsView(courseDateStatistics: entry.courseDateStatistics)
+                    .backport.widgetPadding()
+            } else {
+                EmptyStateView.noCourseDates
+            }
         }
+        .backport.widgetBackground()
     }
 }
 
diff --git a/WidgetExtension/Extensions/View+Backport.swift b/WidgetExtension/Extensions/View+Backport.swift
new file mode 100644
index 000000000..820ce6c08
--- /dev/null
+++ b/WidgetExtension/Extensions/View+Backport.swift
@@ -0,0 +1,32 @@
+//
+//  Created for xikolo-ios under GPL-3.0 license.
+//  Copyright © HPI. All rights reserved.
+//
+
+import SwiftUI
+
+struct Backport<Content> {
+    let content: Content
+}
+
+extension View {
+    var backport: Backport<Self> { Backport(content: self) }
+}
+
+extension Backport where Content: View {
+    @ViewBuilder func widgetBackground<V: View>(@ViewBuilder backgroundView: () -> V = { Color(UIColor.systemBackground) }) -> some View {
+        if #available(iOS 17, *) {
+            content.containerBackground(for: .widget, content: backgroundView)
+        } else {
+            content
+        }
+    }
+
+    @ViewBuilder func widgetPadding() -> some View {
+        if #available(iOS 17, *) {
+            content
+        } else {
+            content.padding()
+        }
+    }
+}
diff --git a/WidgetExtension/NextCourseDateWidget.swift b/WidgetExtension/NextCourseDateWidget.swift
index 675957635..7eb6b8a19 100644
--- a/WidgetExtension/NextCourseDateWidget.swift
+++ b/WidgetExtension/NextCourseDateWidget.swift
@@ -10,14 +10,17 @@ struct NextCourseDateWidgetEntryView: View {
     var entry: CourseDateOverviewWidgetProvider.Entry
 
     var body: some View {
-        if !entry.userIsLoggedIn {
-            EmptyStateView.notLoggedIn
-        } else if let courseDate = entry.nextCourseDate {
-            CourseDateView(courseDate: courseDate)
-                .padding()
-        } else {
-            EmptyStateView.noCourseDates
+        Group {
+            if !entry.userIsLoggedIn {
+                EmptyStateView.notLoggedIn
+            } else if let courseDate = entry.nextCourseDate {
+                CourseDateView(courseDate: courseDate)
+                    .backport.widgetPadding()
+            } else {
+                EmptyStateView.noCourseDates
+            }
         }
+        .backport.widgetBackground()
     }
 }
 
diff --git a/WidgetExtension/Views/EmptyStateView.swift b/WidgetExtension/Views/EmptyStateView.swift
index 0ae302b9f..dd31db6d3 100644
--- a/WidgetExtension/Views/EmptyStateView.swift
+++ b/WidgetExtension/Views/EmptyStateView.swift
@@ -23,7 +23,7 @@ enum EmptyStateView: View {
                 .foregroundColor(Color.secondary)
                 .minimumScaleFactor(0.8)
         }
-        .padding()
+        .backport.widgetPadding()
     }
 
     var headline: Text {
diff --git a/xikolo-ios.xcodeproj/project.pbxproj b/xikolo-ios.xcodeproj/project.pbxproj
index d00c2603a..016bee33d 100644
--- a/xikolo-ios.xcodeproj/project.pbxproj
+++ b/xikolo-ios.xcodeproj/project.pbxproj
@@ -212,6 +212,7 @@
 		506D7E1B2104B7730018D9E2 /* CourseCell.xib in Resources */ = {isa = PBXBuildFile; fileRef = 506D7E1A2104B7730018D9E2 /* CourseCell.xib */; };
 		506E5B2224A102AA00AE899C /* LanguageLocalizer.swift in Sources */ = {isa = PBXBuildFile; fileRef = 506E5B2124A102AA00AE899C /* LanguageLocalizer.swift */; };
 		50761B5820FCADD700CEDAF9 /* Common.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 50FA2DEB20E4B1A800656776 /* Common.framework */; };
+		5076F4982ABAF2DC00B6AB6D /* View+Backport.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5076F4972ABAF2DC00B6AB6D /* View+Backport.swift */; };
 		5077012E218F38BC005568A6 /* InnerPillLabel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5077012D218F38BC005568A6 /* InnerPillLabel.swift */; };
 		507896C8233DEA1A00EA65E5 /* Course+share.swift in Sources */ = {isa = PBXBuildFile; fileRef = 507896C7233DEA1A00EA65E5 /* Course+share.swift */; };
 		507CC05B21788487008819FE /* PillView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 507CC05A21788487008819FE /* PillView.swift */; };
@@ -948,6 +949,7 @@
 		50761B4320FCAC5A00CEDAF9 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		50761B5320FCADD600CEDAF9 /* Common-Tests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = "Common-Tests.xctest"; sourceTree = BUILT_PRODUCTS_DIR; };
 		50761B5720FCADD700CEDAF9 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+		5076F4972ABAF2DC00B6AB6D /* View+Backport.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+Backport.swift"; sourceTree = "<group>"; };
 		5077012D218F38BC005568A6 /* InnerPillLabel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = InnerPillLabel.swift; sourceTree = "<group>"; };
 		507896C7233DEA1A00EA65E5 /* Course+share.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Course+share.swift"; sourceTree = "<group>"; };
 		507A5CC92021CBAA009B1F95 /* GoogleService-Info-Debug.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = "GoogleService-Info-Debug.plist"; sourceTree = "<group>"; };
@@ -1784,6 +1786,7 @@
 				5063F98325C93F51006C3048 /* Color+appColors.swift */,
 				5063F98E25C9400C006C3048 /* UIImage+appIcon.swift */,
 				502E8EA225DAA6C400CFE234 /* Image+centerCropped.swift */,
+				5076F4972ABAF2DC00B6AB6D /* View+Backport.swift */,
 			);
 			path = Extensions;
 			sourceTree = "<group>";
@@ -3297,6 +3300,7 @@
 				5063F98F25C9400C006C3048 /* UIImage+appIcon.swift in Sources */,
 				50AD864E2570F4B0003BDB80 /* XikoloWidgetBundle.swift in Sources */,
 				50F3164025C42F82009BD594 /* ContinueLearningWidgetProvider.swift in Sources */,
+				5076F4982ABAF2DC00B6AB6D /* View+Backport.swift in Sources */,
 				502E8EA325DAA6C400CFE234 /* Image+centerCropped.swift in Sources */,
 				5063F9A525C9BBFE006C3048 /* NextCourseDateWidget.swift in Sources */,
 				50F3164B25C42FC4009BD594 /* CourseView.swift in Sources */,