diff --git a/src/components/AnnotationsModule.vue b/src/components/AnnotationsModule.vue
index c7f5417ee..b185e6acb 100644
--- a/src/components/AnnotationsModule.vue
+++ b/src/components/AnnotationsModule.vue
@@ -1,26 +1,28 @@
-<script lang="ts">
-import { defineComponent } from 'vue';
-import MeasurementsRulerList from './MeasurementsRulerList.vue';
+<script setup lang="ts">
 import MeasurementsToolList from './MeasurementsToolList.vue';
 import LabelmapList from './LabelmapList.vue';
 import ToolControls from './ToolControls.vue';
 import { usePolygonStore } from '../store/tools/polygons';
 import { useRectangleStore } from '../store/tools/rectangles';
+import { useRulerStore } from '../store/tools/rulers';
+import { AnnotationToolStore } from '../store/tools/useAnnotationTool';
+import MeasurementRulerDetails from './MeasurementRulerDetails.vue';
 
-export default defineComponent({
-  components: {
-    MeasurementsRulerList,
-    MeasurementsToolList,
-    LabelmapList,
-    ToolControls,
+const tools = [
+  {
+    store: useRulerStore(),
+    icon: 'mdi-ruler',
+    details: MeasurementRulerDetails,
   },
-  setup() {
-    return {
-      rectangleStore: useRectangleStore(),
-      polygonStore: usePolygonStore(),
-    };
+  {
+    store: useRectangleStore() as unknown as AnnotationToolStore<string>,
+    icon: 'mdi-vector-square',
   },
-});
+  {
+    store: usePolygonStore() as unknown as AnnotationToolStore<string>,
+    icon: 'mdi-pentagon-outline',
+  },
+];
 </script>
 
 <template>
@@ -28,15 +30,7 @@ export default defineComponent({
     <tool-controls />
     <div class="header">Measurements</div>
     <div class="content">
-      <measurements-ruler-list />
-      <measurements-tool-list
-        :tool-store="rectangleStore"
-        icon="mdi-vector-square"
-      />
-      <measurements-tool-list
-        :tool-store="polygonStore"
-        icon="mdi-pentagon-outline"
-      />
+      <measurements-tool-list :tools="tools" />
     </div>
     <div class="text-caption text-center empty-state">No measurements</div>
     <div class="header">Labelmaps</div>
@@ -48,10 +42,6 @@ export default defineComponent({
 </template>
 
 <style scoped>
-.annot-subheader {
-  margin: 8px 0;
-}
-
 .empty-state {
   display: none;
 }
diff --git a/src/components/ImageDataBrowser.vue b/src/components/ImageDataBrowser.vue
index 195b8afd6..d09c372ec 100644
--- a/src/components/ImageDataBrowser.vue
+++ b/src/components/ImageDataBrowser.vue
@@ -123,7 +123,7 @@ export default defineComponent({
 
     // --- selection --- //
 
-    const { selected, selectedAll, selectedSome } =
+    const { selected, selectedAll, selectedSome, toggleSelectAll } =
       useMultiSelection(nonDICOMImages);
 
     function removeSelection() {
@@ -137,6 +137,7 @@ export default defineComponent({
       selected,
       selectedAll,
       selectedSome,
+      toggleSelectAll,
       removeSelection,
       images,
       thumbnails,
@@ -161,6 +162,7 @@ export default defineComponent({
             :indeterminate="selectedSome && !selectedAll"
             label="Select All"
             v-model="selectedAll"
+            @click.stop="toggleSelectAll"
             density="compact"
             hide-details
           />
diff --git a/src/components/MeasurementRulerDetails.vue b/src/components/MeasurementRulerDetails.vue
new file mode 100644
index 000000000..829c5dbd3
--- /dev/null
+++ b/src/components/MeasurementRulerDetails.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import { useRulerStore } from '@/src/store/tools/rulers';
+import { AnnotationTool } from '../types/annotation-tool';
+
+defineProps<{
+  tool: AnnotationTool<string> & { axis: string };
+}>();
+
+const toolStore = useRulerStore();
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="4">Slice: {{ tool.slice + 1 }}</v-col>
+    <v-col cols="4">Axis: {{ tool.axis }}</v-col>
+    <v-col>
+      Length:
+      <span class="value">
+        {{ toolStore.lengthByID[tool.id].toFixed(2) }}mm
+      </span>
+    </v-col>
+  </v-row>
+</template>
diff --git a/src/components/MeasurementToolDetails.vue b/src/components/MeasurementToolDetails.vue
new file mode 100644
index 000000000..031f0e860
--- /dev/null
+++ b/src/components/MeasurementToolDetails.vue
@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import { AnnotationTool } from '../types/annotation-tool';
+
+defineProps<{
+  tool: AnnotationTool<string> & { axis: string };
+}>();
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="4">Slice: {{ tool.slice + 1 }}</v-col>
+    <v-col cols="4">Axis: {{ tool.axis }}</v-col>
+  </v-row>
+</template>
diff --git a/src/components/MeasurementsRulerList.vue b/src/components/MeasurementsRulerList.vue
deleted file mode 100644
index 760bcb324..000000000
--- a/src/components/MeasurementsRulerList.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import MeasurementsToolList from '@/src/components/MeasurementsToolList.vue';
-import { useRulerStore } from '@/src/store/tools/rulers';
-
-const toolStore = useRulerStore();
-</script>
-
-<template>
-  <measurements-tool-list :toolStore="toolStore" icon="mdi-ruler">
-    <template v-slot:details="{ tool }">
-      <v-row>
-        <v-col cols="3">Slice: {{ tool.slice + 1 }}</v-col>
-        <v-col cols="3">Axis: {{ tool.axis }}</v-col>
-        <v-col>
-          Length:
-          <span class="value">
-            {{ toolStore.lengthByID[tool.id].toFixed(2) }}mm
-          </span>
-        </v-col>
-      </v-row>
-    </template>
-  </measurements-tool-list>
-</template>
diff --git a/src/components/MeasurementsToolList.vue b/src/components/MeasurementsToolList.vue
index 888fdc68f..b65197e81 100644
--- a/src/components/MeasurementsToolList.vue
+++ b/src/components/MeasurementsToolList.vue
@@ -1,20 +1,31 @@
-<script setup lang="ts" generic="ToolID extends string">
-/* global ToolID:readonly */
+<script setup lang="ts">
 import { computed } from 'vue';
 import { useCurrentImage } from '@/src/composables/useCurrentImage';
 import { AnnotationToolStore } from '@/src/store/tools/useAnnotationTool';
 import { frameOfReferenceToImageSliceAndAxis } from '@/src/utils/frameOfReference';
+import { nonNullable } from '@/src/utils/index';
+import MeasurementToolDetails from './MeasurementToolDetails.vue';
+import { useMultiSelection } from '../composables/useMultiSelection';
+import { AnnotationTool } from '../types/annotation-tool';
 
-const props = defineProps<{
-  toolStore: AnnotationToolStore<ToolID>;
+type AnnotationToolConfig = {
+  store: AnnotationToolStore<string>;
   icon: string;
+  details?: typeof MeasurementToolDetails;
+};
+
+export type AnnotationTools = Array<AnnotationToolConfig>;
+
+const props = defineProps<{
+  tools: AnnotationTools;
 }>();
 
 const { currentImageID, currentImageMetadata } = useCurrentImage();
 
-const tools = computed(() => {
-  const byID = props.toolStore.toolByID;
-  return props.toolStore.toolIDs
+// Filter and add axis for specific annotation type
+const getTools = (toolStore: AnnotationToolStore<string>) => {
+  const byID = toolStore.toolByID;
+  return toolStore.toolIDs
     .map((id) => byID[id])
     .filter((tool) => !tool.placing && tool.imageID === currentImageID.value)
     .map((tool) => {
@@ -30,48 +41,146 @@ const tools = computed(() => {
         axis,
       };
     });
+};
+
+// Flatten all tool types and add actions
+const tools = computed(() => {
+  return props.tools.flatMap(
+    ({ store, icon, details = MeasurementToolDetails }) => {
+      const toolsWithAxis = getTools(store);
+      return toolsWithAxis.map((tool) => ({
+        ...tool,
+        icon,
+        details,
+        remove: () => store.removeTool(tool.id),
+        jumpTo: () => store.jumpToTool(tool.id),
+        toggleHidden: () => {
+          const toggled = !store.toolByID[tool.id].hidden;
+          store.updateTool(tool.id, { hidden: toggled });
+        },
+        updateTool: (patch: Partial<AnnotationTool<string>>) => {
+          store.updateTool(tool.id, patch);
+        },
+      }));
+    }
+  );
 });
 
-const remove = (id: ToolID) => {
-  props.toolStore.removeTool(id);
-};
+// --- selection and batch actions  --- //
 
-const jumpTo = (id: ToolID) => {
-  props.toolStore.jumpToTool(id);
-};
+const toolIds = computed(() => tools.value.map((tool) => tool.id));
 
-const toggleHidden = (id: ToolID) => {
-  const toggled = !props.toolStore.toolByID[id].hidden;
-  props.toolStore.updateTool(id, { hidden: toggled });
-};
+const { selected, selectedAll, selectedSome, toggleSelectAll } =
+  useMultiSelection(toolIds);
+
+const forEachSelectedTool = (
+  callback: (tool: (typeof tools.value)[number]) => void
+) =>
+  selected.value
+    .map((id) => tools.value.find((tool) => id === tool.id))
+    .filter(nonNullable)
+    .forEach(callback);
+
+function removeAll() {
+  forEachSelectedTool((tool) => tool.remove());
+  selected.value = [];
+}
+
+// If all selected tools are already hidden, it should be "show".
+// If at least one selected tool is visible, it should be "hide".
+const allHidden = computed(() => {
+  return selected.value
+    .map((id) => tools.value.find((tool) => id === tool.id))
+    .filter(nonNullable)
+    .every((tool) => tool.hidden);
+});
+
+function toggleGlobalHidden() {
+  const hidden = !allHidden.value;
+  forEachSelectedTool((tool) => {
+    tool.updateTool({ hidden });
+  });
+}
 </script>
 
 <template>
+  <v-row no-gutters justify="space-between" align="center" class="mb-1">
+    <v-col cols="6">
+      <v-checkbox
+        class="ml-3"
+        :indeterminate="selectedSome && !selectedAll"
+        label="Select All"
+        v-model="selectedAll"
+        @click.stop="toggleSelectAll"
+        density="compact"
+        hide-details
+      />
+    </v-col>
+    <v-col cols="6" align-self="center" class="d-flex justify-end">
+      <v-btn
+        icon
+        variant="text"
+        :disabled="!selectedSome"
+        @click.stop="toggleGlobalHidden"
+      >
+        <v-icon v-if="allHidden">mdi-eye-off</v-icon>
+        <v-icon v-else>mdi-eye</v-icon>
+        <v-tooltip location="top" activator="parent">{{
+          allHidden ? 'Show' : 'Hide'
+        }}</v-tooltip>
+      </v-btn>
+      <v-btn
+        icon
+        variant="text"
+        :disabled="!selectedSome"
+        @click.stop="removeAll"
+      >
+        <v-icon>mdi-delete</v-icon>
+        <v-tooltip :disabled="!selectedSome" location="top" activator="parent">
+          Delete selected
+        </v-tooltip>
+      </v-btn>
+    </v-col>
+  </v-row>
+
   <v-list-item v-for="tool in tools" :key="tool.id">
     <v-container>
-      <v-row class="align-center main-row">
-        <v-icon class="tool-icon">{{ icon }}</v-icon>
-        <div class="color-dot mr-3" :style="{ backgroundColor: tool.color }" />
+      <v-row class="d-flex align-center main-row">
+        <v-checkbox
+          class="no-grow mr-4"
+          density="compact"
+          hide-details
+          :key="tool.id"
+          :value="tool.id"
+          v-model="selected"
+          @click.stop
+        />
+
+        <v-icon class="tool-icon mr-4">{{ tool.icon }}</v-icon>
 
+        <div
+          class="color-dot flex-shrink-0 mr-2"
+          :style="{ backgroundColor: tool.color }"
+        />
         <v-list-item-title v-bind="$attrs">
           {{ tool.labelName }}
         </v-list-item-title>
 
-        <span class="ml-auto actions">
-          <v-btn icon variant="text" @click="toggleHidden(tool.id)">
+        <span class="ml-auto flex-shrink-0">
+          <v-btn icon variant="text" @click="tool.jumpTo()">
+            <v-icon>mdi-target</v-icon>
+            <v-tooltip location="top" activator="parent">
+              Reveal Slice
+            </v-tooltip>
+          </v-btn>
+          <v-btn icon variant="text" @click="tool.toggleHidden()">
             <v-icon v-if="tool.hidden">mdi-eye-off</v-icon>
             <v-icon v-else>mdi-eye</v-icon>
             <v-tooltip location="top" activator="parent">{{
               tool.hidden ? 'Show' : 'Hide'
             }}</v-tooltip>
           </v-btn>
-          <v-btn icon variant="text" @click="jumpTo(tool.id)">
-            <v-icon>mdi-target</v-icon>
-            <v-tooltip location="top" activator="parent">
-              Reveal Slice
-            </v-tooltip>
-          </v-btn>
-          <v-btn icon variant="text" @click="remove(tool.id)">
+          <v-btn icon variant="text" @click="tool.remove()">
             <v-icon>mdi-delete</v-icon>
             <v-tooltip location="top" activator="parent">Delete</v-tooltip>
           </v-btn>
@@ -80,12 +189,7 @@ const toggleHidden = (id: ToolID) => {
 
       <v-row class="mt-4">
         <v-list-item-subtitle class="w-100">
-          <slot name="details" v-bind="{ tool }">
-            <v-row>
-              <v-col cols="3">Slice: {{ tool.slice + 1 }}</v-col>
-              <v-col cols="3">Axis: {{ tool.axis }}</v-col>
-            </v-row>
-          </slot>
+          <component :is="tool.details" :tool="tool" />
         </v-list-item-subtitle>
       </v-row>
     </v-container>
@@ -104,15 +208,13 @@ const toggleHidden = (id: ToolID) => {
   height: 24px;
   background: yellow;
   border-radius: 16px;
-  flex-shrink: 0;
 }
 
 .tool-icon {
-  margin-inline-end: 12px;
   opacity: var(--v-medium-emphasis-opacity);
 }
 
-.actions {
-  flex-shrink: 0;
+.no-grow {
+  flex: 0 0 auto;
 }
 </style>
diff --git a/src/components/PatientBrowser.vue b/src/components/PatientBrowser.vue
index 0a2873a5a..ea8427c19 100644
--- a/src/components/PatientBrowser.vue
+++ b/src/components/PatientBrowser.vue
@@ -1,11 +1,9 @@
 <script lang="ts">
 import { computed, defineComponent, ref, toRefs, watch } from 'vue';
-import type { Ref } from 'vue';
 import ItemGroup from '@/src/components/ItemGroup.vue';
 import { useDICOMStore } from '../store/datasets-dicom';
 import {
   DataSelection,
-  DICOMSelection,
   selectionEquals,
   useDatasetStore,
 } from '../store/datasets';
@@ -27,8 +25,6 @@ export default defineComponent({
   setup(props) {
     const { patientKey } = toRefs(props);
 
-    const selectedSeries: Ref<DICOMSelection[]> = ref([]);
-
     const dicomStore = useDICOMStore();
     const dataStore = useDatasetStore();
 
@@ -62,7 +58,7 @@ export default defineComponent({
 
     // --- selection --- //
 
-    const { selected, selectedAll, selectedSome } =
+    const { selected, selectedAll, selectedSome, toggleSelectAll } =
       useMultiSelection(studyKeys);
 
     const removeSelectedStudies = () => {
@@ -81,7 +77,7 @@ export default defineComponent({
       selected,
       selectedAll,
       selectedSome,
-      selectedSeries,
+      toggleSelectAll,
       primarySelection,
       removeSelectedStudies,
       studies,
@@ -109,6 +105,7 @@ export default defineComponent({
             :indeterminate="selectedSome && !selectedAll"
             label="Select All Studies"
             v-model="selectedAll"
+            @click.stop="toggleSelectAll"
             density="compact"
             hide-details
           />
diff --git a/src/components/PatientStudyVolumeBrowser.vue b/src/components/PatientStudyVolumeBrowser.vue
index 953d04840..2b2316b18 100644
--- a/src/components/PatientStudyVolumeBrowser.vue
+++ b/src/components/PatientStudyVolumeBrowser.vue
@@ -163,7 +163,7 @@ export default defineComponent({
 
     // --- selection --- //
 
-    const { selected, selectedAll, selectedSome } =
+    const { selected, selectedAll, selectedSome, toggleSelectAll } =
       useMultiSelection(volumeKeys);
 
     const removeSelectedDICOMVolumes = () => {
@@ -178,6 +178,7 @@ export default defineComponent({
       selected,
       selectedAll,
       selectedSome,
+      toggleSelectAll,
       thumbnailCache,
       volumes,
       removeSelectedDICOMVolumes,
@@ -195,6 +196,7 @@ export default defineComponent({
           :indeterminate="selectedSome && !selectedAll"
           label="Select All"
           v-model="selectedAll"
+          @click.stop="toggleSelectAll"
           density="compact"
           hide-details
         />
diff --git a/src/composables/useMultiSelection.ts b/src/composables/useMultiSelection.ts
index 646115c09..1d63ca9c1 100644
--- a/src/composables/useMultiSelection.ts
+++ b/src/composables/useMultiSelection.ts
@@ -1,23 +1,29 @@
-import { computed, Ref, ref, watch, UnwrapRef } from 'vue';
+import { computed, ref, Ref, watch } from 'vue';
 
 export function useMultiSelection<T = string>(allItems: Ref<T[]>) {
-  const selected = ref<T[]>([]);
-  const selectedAll = ref(false);
-  const selectedSome = computed(() => selected.value.length > 0);
+  const selected = ref<T[]>([]) as Ref<T[]>;
 
-  watch(selected, () => {
-    selectedAll.value =
-      selected.value.length > 0 &&
-      selected.value.length === allItems.value.length;
+  // remove deleted item
+  watch(allItems, () => {
+    selected.value = selected.value.filter((item) =>
+      allItems.value.includes(item)
+    );
   });
 
-  watch(selectedAll, (yn) => {
-    if (yn) {
-      selected.value = allItems.value as UnwrapRef<T[]>;
-    } else {
+  const selectedSome = computed(() => selected.value.length > 0);
+  const selectedAll = computed(
+    () =>
+      selected.value.length > 0 &&
+      selected.value.length === allItems.value.length
+  );
+
+  const toggleSelectAll = () => {
+    if (selectedAll.value) {
       selected.value = [];
+    } else {
+      selected.value = allItems.value;
     }
-  });
+  };
 
-  return { selected, selectedAll, selectedSome };
+  return { selected, selectedAll, selectedSome, toggleSelectAll };
 }
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 92344e6ca..ad8b326db 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -273,3 +273,7 @@ export function zodEnumFromObjKeys<K extends string>(
   const [firstKey, ...otherKeys] = Object.keys(obj) as K[];
   return z.enum([firstKey, ...otherKeys]);
 }
+
+export function nonNullable<T>(value: T): value is NonNullable<T> {
+  return value != null;
+}