diff --git a/resources/js/components/roles/PermissionTree.vue b/resources/js/components/roles/PermissionTree.vue
index dc49a88c9e..a25fbe8b01 100644
--- a/resources/js/components/roles/PermissionTree.vue
+++ b/resources/js/components/roles/PermissionTree.vue
@@ -36,6 +36,15 @@ export default {
         };
     },
 
+    watch: {
+        initialPermissions: {
+            handler(newPermissions) {
+                this.permissions = newPermissions;
+            },
+            deep: true,
+        },
+    },
+
     methods: {
         updatePermission(permission, checked) {
             permission.checked = checked;
diff --git a/resources/js/components/roles/PublishForm.vue b/resources/js/components/roles/PublishForm.vue
index 1bc6f7556a..6b7098ed7d 100644
--- a/resources/js/components/roles/PublishForm.vue
+++ b/resources/js/components/roles/PublishForm.vue
@@ -9,6 +9,12 @@
                 prioritize
                 v-slot="{ text, action }"
             >
+                <Button
+                    v-if="!isSuper"
+                    :icon="areAllCheckedInAllGroups() ? 'checkbox-uncheck' : 'checkbox'"
+                    @click="toggleAllInAllGroups()"
+                    :text="areAllCheckedInAllGroups() ? __('Uncheck All') : __('Check All')"
+                />
                 <Button type="submit" variant="primary" @click="action" :text="text" />
             </CommandPaletteItem>
         </Header>
@@ -49,15 +55,27 @@
         </Panel>
 
         <div v-if="!isSuper" class="space-y-6 mt-6">
-            <CardPanel v-for="group in permissions" :key="group.handle" :heading="group.label">
-                <PermissionTree :depth="1" :initial-permissions="group.permissions" />
-            </CardPanel>
+            <Panel :heading="group.label" v-for="group in permissions" :key="group.handle">
+                <template #header-actions>
+                    <Button
+                        size="sm"
+                        variant="subtle"
+                        :icon="areAllChecked(group) ? 'checkbox-uncheck' : 'checkbox'"
+                        @click="toggleAllInGroup(group)"
+                    >
+                        {{ areAllChecked(group) ? __('Uncheck All') : __('Check All') }}
+                    </Button>
+                </template>
+                <Card>
+                    <PermissionTree :depth="1" :initial-permissions="group.permissions" />
+                </Card>
+            </Panel>
         </div>
     </div>
 </template>
 
 <script>
-import { Header, Button, CardPanel, Panel, PanelHeader, Heading, Card, Switch, Field, Input, CommandPaletteItem } from '@/components/ui';
+import { Header, Button, Panel, PanelHeader, Heading, Card, Switch, Field, Input, CommandPaletteItem } from '@/components/ui';
 import { requireElevatedSession } from '@/components/elevated-sessions';
 import PermissionTree from '@/components/roles/PermissionTree.vue';
 import { router } from '@inertiajs/vue3';
@@ -74,7 +92,6 @@ export default {
         PermissionTree,
         Header,
         Button,
-        CardPanel,
         Panel,
         PanelHeader,
         Heading,
@@ -141,6 +158,50 @@ export default {
     },
 
     methods: {
+        areAllChecked(group) {
+            const checkAll = (permissions) => {
+                return permissions.every(permission => {
+                    const childrenChecked = permission.children && permission.children.length
+                        ? checkAll(permission.children)
+                        : true;
+                    return permission.checked && childrenChecked;
+                });
+            };
+            return checkAll(group.permissions);
+        },
+
+        areAllCheckedInAllGroups() {
+            return this.permissions.every(group => this.areAllChecked(group));
+        },
+
+        toggleAllInGroup(group) {
+            const allChecked = this.areAllChecked(group);
+            const toggle = (permissions, checked) => {
+                permissions.forEach(permission => {
+                    permission.checked = checked;
+                    if (permission.children && permission.children.length) {
+                        toggle(permission.children, checked);
+                    }
+                });
+            };
+            toggle(group.permissions, !allChecked);
+        },
+
+        toggleAllInAllGroups() {
+            const allChecked = this.areAllCheckedInAllGroups();
+            this.permissions.forEach(group => {
+                const toggle = (permissions, checked) => {
+                    permissions.forEach(permission => {
+                        permission.checked = checked;
+                        if (permission.children && permission.children.length) {
+                            toggle(permission.children, checked);
+                        }
+                    });
+                };
+                toggle(group.permissions, !allChecked);
+            });
+        },
+
         clearErrors() {
             this.error = null;
             this.errors = {};
diff --git a/resources/svg/icons/checkbox-uncheck.svg b/resources/svg/icons/checkbox-uncheck.svg
new file mode 100644
index 0000000000..eadf70302e
--- /dev/null
+++ b/resources/svg/icons/checkbox-uncheck.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M10 7 4 7" stroke-width="1"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M0.960355 10.2878C1.11449 11.737 2.27319 12.9026 3.71314 13.064c2.2118 0.248 4.36289 0.248 6.57466 0 1.44 -0.1614 2.5987 -1.327 2.7528 -2.7762 0.1138 -1.06976 0.2099 -2.16807 0.2099 -3.2878 0 -1.11973 -0.0961 -2.21805 -0.2099 -3.28784 -0.1541 -1.44916 -1.3128 -2.61471 -2.7528 -2.776165 -2.21177 -0.247993 -4.36286 -0.247993 -6.57466 0C2.27319 1.09745 1.11449 2.263 0.960355 3.71216 0.846572 4.78195 0.750488 5.88027 0.750488 7c0 1.11973 0.096084 2.21804 0.209867 3.2878Z" stroke-width="1"/></svg>
\ No newline at end of file
diff --git a/resources/svg/icons/checkbox.svg b/resources/svg/icons/checkbox.svg
new file mode 100644
index 0000000000..3a74405e91
--- /dev/null
+++ b/resources/svg/icons/checkbox.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M0.959867 10.2685C1.114 11.7092 2.2727 12.8679 3.71266 13.0284 4.78221 13.1476 5.88037 13.25 7 13.25s2.21779 -0.1024 3.2873 -0.2216c1.44 -0.1605 2.5987 -1.3192 2.7528 -2.7599 0.1138 -1.06348 0.2099 -2.15535 0.2099 -3.2685 0 -1.11316 -0.0961 -2.20502 -0.2099 -3.26853 -0.1541 -1.44065 -1.3128 -2.59936 -2.7528 -2.759861C9.21779 0.852392 8.11963 0.75 7 0.75S4.78221 0.852392 3.71266 0.971609C2.2727 1.13211 1.114 2.29082 0.959867 3.73147 0.846083 4.79498 0.75 5.88684 0.75 7c0 1.11315 0.096084 2.20502 0.209867 3.2685Z" stroke-width="1"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4.5 7.625 6.31818 9.5c0.85557 -2.45768 1.5681 -3.53614 3.18182 -5" stroke-width="1"/></svg>
\ No newline at end of file