diff --git a/resources/css/elements/buttons.css b/resources/css/elements/buttons.css
index 5c0767a3b6..a6d9049fca 100644
--- a/resources/css/elements/buttons.css
+++ b/resources/css/elements/buttons.css
@@ -190,7 +190,7 @@ button {
   ========================================================================== */
 
 .btn-group {
-    @apply flex items-center justify-start p-0;
+    @apply flex items-center justify-start p-0 cursor-auto;
     height: 2.375rem;
 
     button {
diff --git a/resources/js/components/fieldtypes/ButtonGroupFieldtype.vue b/resources/js/components/fieldtypes/ButtonGroupFieldtype.vue
index 4124080f55..f991d0ece2 100644
--- a/resources/js/components/fieldtypes/ButtonGroupFieldtype.vue
+++ b/resources/js/components/fieldtypes/ButtonGroupFieldtype.vue
@@ -7,7 +7,7 @@
                 ref="button"
                 type="button"
                 :name="name"
-                @click="update($event.target.value)"
+                @click="updateSelectedOption($event.target.value)"
                 :value="option.value"
                 :disabled="isReadOnly"
                 :class="{'active': value === option.value}"
@@ -53,6 +53,10 @@ export default {
 
     methods: {
 
+        updateSelectedOption(newValue) {
+            this.update(this.value == newValue && this.config.clearable ? null : newValue);
+        },
+
         setupResizeObserver() {
             this.resizeObserver = new ResizeObserver(() => {
                 this.handleWrappingOfNode(this.$refs.buttonGroup);
diff --git a/src/Fieldtypes/ButtonGroup.php b/src/Fieldtypes/ButtonGroup.php
index 318b138167..5e56ce62d8 100644
--- a/src/Fieldtypes/ButtonGroup.php
+++ b/src/Fieldtypes/ButtonGroup.php
@@ -25,6 +25,12 @@ protected function configFieldItems(): array
                         'value_header' => __('Label').' ('.__('Optional').')',
                         'add_button' => __('Add Option'),
                     ],
+                    'clearable' => [
+                        'display' => __('Clearable'),
+                        'instructions' => __('statamic::fieldtypes.select.config.clearable'),
+                        'type' => 'toggle',
+                        'default' => false,
+                    ],
                     'default' => [
                         'display' => __('Default Value'),
                         'instructions' => __('statamic::messages.fields_default_instructions'),