diff --git a/packages/block-editor/src/components/global-styles/color-panel.js b/packages/block-editor/src/components/global-styles/color-panel.js
index 5d5c02d179307d..7f66ff8d102809 100644
--- a/packages/block-editor/src/components/global-styles/color-panel.js
+++ b/packages/block-editor/src/components/global-styles/color-panel.js
@@ -177,7 +177,6 @@ const LabeledColorIndicators = ( { indicators, label } ) => (
 function ColorPanelTab( {
 	isGradient,
 	inheritedValue,
-	userValue,
 	setValue,
 	colorGradientControlSettings,
 } ) {
@@ -191,7 +190,6 @@ function ColorPanelTab( {
 			gradientValue={ isGradient ? inheritedValue : undefined }
 			onColorChange={ isGradient ? undefined : setValue }
 			onGradientChange={ isGradient ? setValue : undefined }
-			clearable={ inheritedValue === userValue }
 			headingLevel={ 3 }
 		/>
 	);
diff --git a/packages/components/src/color-palette/index.tsx b/packages/components/src/color-palette/index.tsx
index d9d7b82d542a7f..de4e4f4206fe3a 100644
--- a/packages/components/src/color-palette/index.tsx
+++ b/packages/components/src/color-palette/index.tsx
@@ -241,11 +241,11 @@ function UnforwardedColorPalette(
 		value,
 	};
 
-	const actions = (
+	const actions = !! clearable && (
 		<CircularOptionPicker.ButtonAction
 			onClick={ clearColor }
 			accessibleWhenDisabled
-			disabled={ ! value || ! clearable }
+			disabled={ ! value }
 		>
 			{ __( 'Clear' ) }
 		</CircularOptionPicker.ButtonAction>