diff --git a/css/contacts.scss b/css/contacts.scss
index 72ed427d0..d71474a34 100644
--- a/css/contacts.scss
+++ b/css/contacts.scss
@@ -26,10 +26,6 @@ $grid-input-padding: 7px;
 $grid-input-margin: 3px;
 $grid-input-height-with-margin: $grid-height-unit - $grid-input-margin * 2;
 
-#app-content-wrapper {
-	display: flex;
-}
-
 // components
 @import 'SettingsSection';
 @import 'Settings/SettingsAddressbook';
diff --git a/src/views/Contacts.vue b/src/views/Contacts.vue
index ff3167bae..97f33223c 100644
--- a/src/views/Contacts.vue
+++ b/src/views/Contacts.vue
@@ -23,6 +23,12 @@
 
 <template>
 	<Content app-name="contacts">
+		<!-- go back to list when in details mode -->
+		<a v-if="selectedContact && isMobile"
+			class="app-details-toggle icon-confirm"
+			href="#"
+			@click.stop.prevent="showList" />
+
 		<!-- new-contact-button + navigation + settings -->
 		<AppNavigation>
 			<!-- new-contact-button -->
@@ -687,6 +693,20 @@ export default {
 			this.searchQuery = ''
 		},
 
+		/**
+		 * Show the list and deselect contact
+		 */
+		showList() {
+			// Reset the selected contact
+			this.$router.push({
+				name: 'contact',
+				params: {
+					selectedGroup: this.selectedGroup,
+					selectedContact: undefined,
+				},
+			})
+		},
+
 		/**
 		 * Done importing, the user closed the import status screen
 		 */
@@ -833,4 +853,28 @@ export default {
 #app-content-wrapper {
 	display: flex;
 }
+
+.app-details-toggle {
+	position: absolute;
+	width: 44px;
+	height: 44px;
+	padding: 14px;
+	cursor: pointer;
+	opacity: .6;
+	font-size: 16px;
+	line-height: 17px;
+	transform: rotate(180deg);
+	background-color: var(--color-main-background);
+	z-index: 2000;
+	&:active,
+	&:hover,
+	&:focus {
+		opacity: 1;
+	}
+
+	// Hide app-navigation toggle if shown
+	&::v-deep + .app-navigation .app-navigation-toggle {
+		display: none;
+	}
+}
 </style>