diff --git a/src/bundle/Resources/public/scss/_double-input-range.scss b/src/bundle/Resources/public/scss/_double-input-range.scss
new file mode 100644
index 0000000000..83e64e50b2
--- /dev/null
+++ b/src/bundle/Resources/public/scss/_double-input-range.scss
@@ -0,0 +1,17 @@
+.ibexa-double-input-range {
+    display: flex;
+
+    &__separator {
+        border-bottom: calculateRem(1px) solid $ibexa-color-dark-300;
+        width: calculateRem(10px);
+        margin: calculateRem(24px) calculateRem(8px);
+    }
+
+    &__inputs-wrapper {
+        display: flex;
+    }
+
+    &--single-label {
+        flex-direction: column;
+    }
+}
diff --git a/src/bundle/Resources/public/scss/ibexa.scss b/src/bundle/Resources/public/scss/ibexa.scss
index 978347b4ae..09a2046778 100644
--- a/src/bundle/Resources/public/scss/ibexa.scss
+++ b/src/bundle/Resources/public/scss/ibexa.scss
@@ -120,3 +120,4 @@
 @import 'default-location';
 @import 'steps';
 @import 'summary-tile';
+@import 'double-input-range';
diff --git a/src/bundle/Resources/views/themes/admin/ui/component/double_input_range/double_input_range.html.twig b/src/bundle/Resources/views/themes/admin/ui/component/double_input_range/double_input_range.html.twig
new file mode 100644
index 0000000000..c7b0296e14
--- /dev/null
+++ b/src/bundle/Resources/views/themes/admin/ui/component/double_input_range/double_input_range.html.twig
@@ -0,0 +1,40 @@
+{% import "@ibexadesign/ui/component/macros.html.twig" as html %}
+
+{% set attr = attr|default({})|merge({
+    class: ('ibexa-double-input-range '
+        ~ (is_single_label|default(false) ? 'ibexa-double-input-range--single-label ')
+        ~ icon_wrapper_attr.class|default(''))|trim,
+}) %}
+
+{% set single_label_attr = single_label_attr|default({})|merge({
+    class: ('ibexa-label ' ~ single_label_attr.class|default(''))|trim,
+}) %}
+
+{% set inputs_wrapper_attr = inputs_wrapper_attr|default({})|merge({
+    class: ('ibexa-double-input-range__inputs-wrapper ' ~ inputs_wrapper_attr.class|default(''))|trim,
+}) %}
+
+{% set separator_attr = separator_attr|default({})|merge({
+    class: ('ibexa-double-input-range__separator ' ~ separator_attr.class|default(''))|trim,
+}) %}
+
+<div {{ html.attributes(attr) }}>
+    <div class="form-group">
+        {% if is_single_label|default(false) %}
+            <label {{ html.attributes(single_label_attr) }}>
+                {{ single_label }}
+            </label>
+        {% endif %}
+        <div {{ html.attributes(inputs_wrapper_attr) }}>
+            {% block min_input %}
+                {{ min_input|raw }}
+            {% endblock %}
+
+            <div {{ html.attributes(separator_attr) }}></div>
+
+            {% block max_input %}
+                {{ max_input|raw }}
+            {% endblock %}
+        </div>
+    </div>
+</div>