diff --git a/packages/block-editor/src/components/colors-gradients/dropdown.js b/packages/block-editor/src/components/colors-gradients/dropdown.js
index e60add8b706d09..a18c3ba30960ed 100644
--- a/packages/block-editor/src/components/colors-gradients/dropdown.js
+++ b/packages/block-editor/src/components/colors-gradients/dropdown.js
@@ -84,6 +84,7 @@ const renderToggle =
 	( settings ) =>
 	( { onToggle, isOpen } ) => {
 		const {
+			clearable,
 			colorValue,
 			gradientValue,
 			onColorChange,
@@ -120,7 +121,7 @@ const renderToggle =
 						label={ label }
 					/>
 				</Button>
-				{ value && (
+				{ clearable && value && (
 					<Button
 						__next40pxDefaultSize
 						label={ __( 'Reset' ) }
@@ -187,6 +188,7 @@ export default function ColorGradientSettingsDropdown( {
 					...setting,
 				};
 				const toggleSettings = {
+					clearable: controlProps.clearable,
 					label: setting.label,
 					colorValue: setting.colorValue,
 					gradientValue: setting.gradientValue,