diff --git a/_includes/hipstable.md b/_includes/hipstable.md
index 8d7ac4ac7..5c6b9b07d 100644
--- a/_includes/hipstable.md
+++ b/_includes/hipstable.md
@@ -1,29 +1,28 @@
 <div class="hip-filters filter-wrap">
     <div class="filter-group">
         <h4>Type&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h4>
-        <label><input type="checkbox" class="filter check-all" value="all" checked> All</label>
-        <label><input type="checkbox" class="filter" value="core" checked> Core</label>
-        <label><input type="checkbox" class="filter" value="service" checked> Service</label>
-        <label><input type="checkbox" class="filter" value="mirror" checked> Mirror</label>
-        <label><input type="checkbox" class="filter" value="application" checked> Application</label>
-        <label><input type="checkbox" class="filter" value="informational" checked> Informational</label>
-        <label><input type="checkbox" class="filter" value="process" checked> Process</label>
+        <select id="type-filter" class="type-filter" multiple>
+            <option value="core">Core</option>
+            <option value="service">Service</option>
+            <option value="mirror">Mirror</option>
+            <option value="application">Application</option>
+            <option value="informational">Informational</option>
+            <option value="process">Process</option>
+        </select>
     </div>
     <div class="filter-group">
         <h4>Status&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h4>
-        <!-- Status Filter Dropdown -->
         <select id="status-filter" class="status-filter" multiple>
-            <option value="draft">Draft</option>
-            <option value="withdrawn">Withdrawn</option>
             <option value="review">Review</option>
-            <option value="stagnant">Stagnant</option>
-            <option value="deferred">Deferred</option>
             <option value="last call">Last Call</option>
             <option value="accepted">Accepted</option>
             <option value="rejected">Rejected</option>
             <option value="final">Final</option>
             <option value="active">Active</option>
             <option value="replaced">Replaced</option>
+            <option value="stagnant">Stagnant</option>
+            <option value="deferred">Deferred</option>
+            <option value="withdrawn">Withdrawn</option>
         </select>
     </div>
     <div class="filter-group">
diff --git a/assets/js/filter.js b/assets/js/filter.js
index 066d4b2d2..965f3bece 100644
--- a/assets/js/filter.js
+++ b/assets/js/filter.js
@@ -1,6 +1,4 @@
 document.addEventListener('DOMContentLoaded', () => {
-    const typeCategoryCheckboxes = document.querySelectorAll('.hip-filters .filter:not(.check-all)');
-    const checkAllCheckbox = document.querySelector('.hip-filters .check-all');
     const statusSelect = $('#status-filter');
     const councilApprovalFilters = document.querySelectorAll('input[name="council-approval-filter"]');
     const noHipsMessage = document.querySelector('.no-hips-message');
@@ -23,21 +21,23 @@ document.addEventListener('DOMContentLoaded', () => {
         placeholder: "Select statuses",
         allowClear: true
     }).on('change', () => {
-        if (statusSelect.val().length === 0) {
-            filterRows();
-        } else {
-            filterRows();
-        }
+        filterRows();
+    });
+
+    $('#type-filter').select2({
+        placeholder: "Select types",
+        allowClear: true
+    }).on('change', () => {
+        filterRows();
     });
 
     function filterRows() {
-        const selectedTypes = Array.from(typeCategoryCheckboxes)
-            .filter(checkbox => checkbox.checked)
-            .map(checkbox => checkbox.value.trim().toLowerCase());
+        let selectedTypes = $('#type-filter').val();
+        if (!selectedTypes || selectedTypes.length === 0) {
+            selectedTypes = $('#type-filter option').map(function() { return this.value }).get();
+        }
 
-        // If nothing is selected in the Status select, treat it as "all"
         const selectedStatuses = statusSelect.val().length > 0 ? statusSelect.val() : ['all'];
-        // If no council approval filter is selected, treat it as "all"
         const selectedCouncilApproval = document.querySelector('input[name="council-approval-filter"]:checked')?.value || 'all';
         let anyRowVisible = false;
         document.querySelectorAll('.hipstable tbody tr').forEach(row => {
@@ -45,7 +45,7 @@ document.addEventListener('DOMContentLoaded', () => {
             const rowStatus = row.getAttribute('data-status').trim().toLowerCase();
             const rowCouncilApproval = row.getAttribute('data-council-approval');
 
-            const typeCategoryMatch = checkAllCheckbox.checked || selectedTypes.some(type => rowTypes.includes(type));
+            const typeCategoryMatch = selectedTypes.some(type => rowTypes.includes(type));
             const statusMatch = selectedStatuses.includes('all') || selectedStatuses.includes(rowStatus);
             const councilApprovalMatch = selectedCouncilApproval === 'all' || selectedCouncilApproval === rowCouncilApproval;
 
@@ -60,48 +60,25 @@ document.addEventListener('DOMContentLoaded', () => {
         noHipsMessage.style.display = anyRowVisible ? 'none' : 'block';
         updateTableVisibility();
     }
-    
 
     function updateTableVisibility() {
         let anyTableVisible = false;
-
         document.querySelectorAll('.hipstable').forEach(table => {
             const isVisible = Array.from(table.querySelectorAll('tbody tr')).some(row => row.style.display !== 'none');
             anyTableVisible = anyTableVisible || isVisible;
-
             table.style.display = isVisible ? '' : 'none';
             const heading = table.previousElementSibling;
-            if (heading) heading.style.display = isVisible ? '' : 'none';
+            heading.style.display = isVisible ? '' : 'none';
         });
-
         noHipsMessage.textContent = anyTableVisible ? '' : 'No HIPs match this filter.';
     }
 
     function bindEventListeners() {
-        typeCategoryCheckboxes.forEach(checkbox => {
-            checkbox.addEventListener('change', () => {
-                const allChecked = Array.from(typeCategoryCheckboxes).every(cb => cb.checked);
-                checkAllCheckbox.checked = allChecked;
-                filterRows();
-            });
-        });
-        
-        if (checkAllCheckbox) {
-            checkAllCheckbox.addEventListener('change', () => {
-                const isChecked = checkAllCheckbox.checked;
-                typeCategoryCheckboxes.forEach(cb => {
-                    cb.checked = isChecked;
-                });
-                filterRows();
-            });
-        }
-    
         if (councilApprovalFilters.length > 0) {
             councilApprovalFilters.forEach(filter => filter.addEventListener('change', filterRows));
         }
     }
     
-
     bindEventListeners();
     filterRows();
-});
+});
\ No newline at end of file