diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/Autocomplete.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/Autocomplete.css
index d6fcd08360..40a08ee2d3 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/Autocomplete.css
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/Autocomplete.css
@@ -29,13 +29,17 @@
     align-items: center;
 }
 
-.mx_Autocomplete_Completion:focus {
+.mx_Autocomplete_Completion.selected * {
+    transition: 0.3s all ease;
+}
+
+.mx_Autocomplete_Completion.selected {
     background: #76cfa6;
     color: white;
     outline: none;
 }
 
-.mx_Autocomplete_Completion:focus * {
+.mx_Autocomplete_Completion.selected * {
     color: white !important;
 }