diff --git a/javascript/extraNetworks.js b/javascript/extraNetworks.js
index 0becc01d..c0973394 100644
--- a/javascript/extraNetworks.js
+++ b/javascript/extraNetworks.js
@@ -5,10 +5,22 @@ function setupExtraNetworksForTab(tabname){
     var tabs = gradioApp().querySelector('#'+tabname+'_extra_tabs > div')
     var search = gradioApp().querySelector('#'+tabname+'_extra_search textarea')
     var refresh = gradioApp().getElementById(tabname+'_extra_refresh')
-
+	
+	let clear = document.createElement("div");
+	clear.id = 	tabname+'_extra_clear';
+	clear.classList.add("token-remove", "remove-all", "svelte-a6vu2r", "hide");
+	clear.title = "Clear search";
+	clear.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></svg>'
+    
     search.classList.add('search')
-    tabs.appendChild(search)
-    tabs.appendChild(refresh)
+    tabs.appendChild(search)    
+	tabs.appendChild(clear)
+	tabs.appendChild(refresh)
+	
+	clear.addEventListener("click", function(evt){
+		search.value = "";
+		updateInput(search);
+	})
 
     search.addEventListener("input", function(evt){
         searchTerm = search.value.toLowerCase()
diff --git a/javascript/ui.js b/javascript/ui.js
index 5df3207f..915dca58 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -865,6 +865,24 @@ onUiUpdate(function(){
 		}		
 	})
 	
+	gradioApp().querySelectorAll('[id$="2img_extra_tabs"] .search').forEach(function (elem){
+		elem.addEventListener('keyup', function (e) {
+			if (e.defaultPrevented) {
+				return; // Do nothing if event already handled
+			}
+			switch (e.code) {
+				case "Escape":
+				if(e.target.value == ""){
+					net_menu.click();
+				}else{
+					e.target.value = "";
+					updateInput(e.target);
+				}
+				break;
+			}
+		})
+	})
+	
 	// add - remove quicksettings
 	const settings_submit = gradioApp().querySelector('#settings_submit');
 	const quick_parent = gradioApp().querySelector("#quicksettings_overflow_container");
diff --git a/style.css b/style.css
index 16d62262..f3640696 100644
--- a/style.css
+++ b/style.css
@@ -1882,7 +1882,7 @@ canvas[key=mask] {
 }
 
 [id$="png_2img_settings_scroll"] div[data-testid="image"] img {
-    max-height: unset;;
+    max-height: calc(var(--container-height) - var(--inside-padding-size) * 2 - var(--outside-gap-size) * 2 );
 }
 
 #pnginfo_image div[data-testid="image"] > div{
@@ -3780,6 +3780,19 @@ footer {
     text-align: center;
 }
 
+.extra-networks [id$="2img_extra_clear"]
+{
+	position: relative;
+    border-radius: 50%!important;
+    margin-left: -25px !important;
+    margin-top: 7px !important;
+    right: 7px;
+    width: 20px;
+    height: 20px;
+    padding: 2px;
+    background-color: var(--panel-border-color) !important;
+    fill: var(--input-color);
+}
 
 a[data-tooltip].top:before, a[data-tooltip].top:after {
   transform: translateY(10px);