diff --git a/Build/Resources/Public/Less/TYPO3/_topbar.less b/Build/Resources/Public/Less/TYPO3/_topbar.less
index 3a36ca4dda40a3d063d03f4fb03d6627f1e80c86..d8697c582c0faf02de8d262659c6e2f878463ff3 100644
--- a/Build/Resources/Public/Less/TYPO3/_topbar.less
+++ b/Build/Resources/Public/Less/TYPO3/_topbar.less
@@ -341,6 +341,12 @@
 			margin-top: -8px;
 			z-index: 1;
 		}
+
+		button.close {
+			opacity: 1;
+			color: @topbar-navigation-color;
+			text-shadow: none;
+		}
 	}
 	.form-control {
 		background-color: @tobar-navigation-search-bg;
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/LiveSearch.js b/typo3/sysext/backend/Resources/Public/JavaScript/LiveSearch.js
index 35be20ae589c25b76dfb243fccd345e90ca3f1a8..dec2649a3cd3707795514b1d383f0c07f0c937d2 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/LiveSearch.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/LiveSearch.js
@@ -14,7 +14,7 @@
 /**
  * Global search to deal with everything in the backend that is search-related
  */
-define('TYPO3/CMS/Backend/LiveSearch', ['jquery', 'jquery/autocomplete'], function ($) {
+define('TYPO3/CMS/Backend/LiveSearch', ['jquery', 'jquery/autocomplete', 'TYPO3/CMS/Backend/jquery.clearable'], function ($) {
 
 	var containerSelector = '#typo3-cms-backend-backend-toolbaritems-livesearchtoolbaritem';
 	var searchFieldSelector = '.t3js-topbar-navigation-search-field';
@@ -92,6 +92,14 @@ define('TYPO3/CMS/Backend/LiveSearch', ['jquery', 'jquery/autocomplete'], functi
 			evt.preventDefault();
 			jump($(this).data('target'), 'web_list', 'web', $(this).data('pageid'));
 		});
+
+		$(searchFieldSelector).clearable(
+			{
+				onClear: function() {
+					$(containerSelector).removeClass('open');
+				}
+			}
+		);
 	};
 
 	$(document).ready(function() {
diff --git a/typo3/sysext/t3skin/Resources/Public/Css/backend.css b/typo3/sysext/t3skin/Resources/Public/Css/backend.css
index cd3e29f31e760192b2beaf5f9c3a824897385dda..9fc7cb16a7e898125df512ceefdcf893539fd0c2 100644
--- a/typo3/sysext/t3skin/Resources/Public/Css/backend.css
+++ b/typo3/sysext/t3skin/Resources/Public/Css/backend.css
@@ -13277,6 +13277,11 @@ iframe {
   margin-top: -8px;
   z-index: 1;
 }
+.typo3-topbar-navigation-search .form-group button.close {
+  opacity: 1;
+  color: #dddddd;
+  text-shadow: none;
+}
 .typo3-topbar-navigation-search .form-control {
   background-color: #222222;
   color: #dddddd;