diff --git a/templates/clients.html b/templates/clients.html
index 689c261..b171e41 100644
--- a/templates/clients.html
+++ b/templates/clients.html
@@ -250,6 +250,28 @@ Wireguard Clients
             populateClientList();
         })
 
+        // show search bar and override :contains to be case-insensitive
+        $(document).ready(function () {
+            $("#search-form").show();
+            jQuery.expr[':'].contains = function(a, i, m) {
+                return jQuery(a).text().toUpperCase()
+                    .indexOf(m[3].toUpperCase()) >= 0;
+            };
+        })
+
+        // hide all clients and display only the ones that meet the search criteria (name, email, IP)
+        $('#search-input').keyup(function () {
+            var query = $(this).val();
+            $('.col-lg-4').hide();
+            $(".info-box-text").each(function() {
+                if($(this).children('i.fa-user').length > 0 || $(this).children('i.fa-envelope').length > 0)
+                {
+                    $(this).filter(':contains("' + query + '")').parent().parent().parent().show();
+                }
+                })
+            $(".badge-secondary").filter(':contains("' + query + '")').parent().parent().parent().show();
+        })
+
         // modal_pause_client modal event
         $("#modal_pause_client").on('show.bs.modal', function (event) {
             const button = $(event.relatedTarget);
@@ -400,7 +422,7 @@ Wireguard Clients
                 cache: false,
                 method: 'GET',
                 url: '{{.basePath}}/api/client/' + client_id,
-                data: { 
+                data: {
                     qrCodeIncludeFwMark: include_fwmark
                 },
                 dataType: 'json',
@@ -588,7 +610,7 @@ Wireguard Clients
                     $(element).removeClass('is-invalid');
                 }
             });
-            // 
+            //
         });
     </script>
 {{end}}