diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index c32765beb5..1dc5ed5980 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -146,6 +146,7 @@ export default {
 	position: -webkit-sticky;
 	top: $header-height;
 	left: 0;
+	padding: 8px 12px;
 	// Above appcontent
 	z-index: 1800;
 	height: calc(100vh - #{$header-height});
diff --git a/src/components/AppNavigationItem/AppNavigationItem.vue b/src/components/AppNavigationItem/AppNavigationItem.vue
index f257ca2fe2..6814276b3e 100644
--- a/src/components/AppNavigationItem/AppNavigationItem.vue
+++ b/src/components/AppNavigationItem/AppNavigationItem.vue
@@ -497,6 +497,7 @@ export default {
 	width: 100%;
 	min-height: $clickable-area;
 	padding-right: 8px;
+	border-radius: var(--border-radius-large);
 
 	// When .active class is applied, change color background of link and utils. The
 	// !important prevents the focus state to override the active state.