diff --git a/blocks/inspector-controls/range-control/index.js b/blocks/inspector-controls/range-control/index.js
index 46b6e0ff1401d..2f4b313f0ef17 100644
--- a/blocks/inspector-controls/range-control/index.js
+++ b/blocks/inspector-controls/range-control/index.js
@@ -10,10 +10,25 @@ import { __ } from '@wordpress/i18n';
 import BaseControl from './../base-control';
 import './style.scss';
 
-function RangeControl( { label, value, instanceId, onChange, beforeIcon, afterIcon, help, allowReset, ...props } ) {
+function RangeControl( { label, value, instanceId, onChange, beforeIcon, afterIcon, help, allowReset, showNumber = true, ...props } ) {
 	const id = 'inspector-range-control-' + instanceId;
 	const onChangeValue = ( event ) => onChange( Number( event.target.value ) );
 
+	function renderNumber() {
+		if ( ! showNumber ) {
+			return null;
+		}
+		return (
+			<input
+				className="blocks-range-control__number"
+				type="number"
+				onChange={ onChangeValue }
+				value={ value }
+				{ ...props }
+			/>
+		);
+	}
+
 	return (
 		<BaseControl label={ label } id={ id } help={ help } className="blocks-range-control">
 			{ beforeIcon && <Dashicon icon={ beforeIcon } size={ 20 } /> }
@@ -26,13 +41,7 @@ function RangeControl( { label, value, instanceId, onChange, beforeIcon, afterIc
 				aria-describedby={ !! help ? id + '__help' : undefined }
 				{ ...props } />
 			{ afterIcon && <Dashicon icon={ afterIcon } /> }
-			<input
-				className="blocks-range-control__number"
-				type="number"
-				onChange={ onChangeValue }
-				value={ value }
-				{ ...props }
-			/>
+			{ renderNumber() }
 			{ allowReset &&
 				<Button onClick={ () => onChange() } disabled={ value === undefined }>
 					{ __( 'Reset' ) }