diff --git a/modules/facets_range_widget/facets_range_widget.libraries.yml b/modules/facets_range_widget/facets_range_widget.libraries.yml
index 32ebfad..dd8405e 100644
--- a/modules/facets_range_widget/facets_range_widget.libraries.yml
+++ b/modules/facets_range_widget/facets_range_widget.libraries.yml
@@ -26,3 +26,12 @@ slider:
     - core/jquery.once
     - facets_range_widget/jquery.ui.slider.pips
     - core/jquery.ui.touch-punch
+
+dropdowns:
+  version: VERSION
+  js:
+    js/dropdowns.js: {}
+  dependencies:
+    - core/drupal
+    - core/drupalSettings
+    - core/jquery.once
diff --git a/modules/facets_range_widget/js/dropdowns.js b/modules/facets_range_widget/js/dropdowns.js
new file mode 100644
index 0000000..6dc86c7
--- /dev/null
+++ b/modules/facets_range_widget/js/dropdowns.js
@@ -0,0 +1,47 @@
+/**
+ * @file
+ * Provides dropdowns range widget functionality.
+ */
+
+(function ($) {
+
+  'use strict';
+
+  Drupal.facets = Drupal.facets || {};
+
+  Drupal.behaviors.range_dropdowns = {
+    attach: function (context, settings) {
+      if (settings.facets !== 'undefined' && settings.facets.range_dropdowns !== 'undefined') {
+        $.each(settings.facets.range_dropdowns, function (facet, settings) {
+          Drupal.facets.addRangeDropdowns(facet, settings);
+        });
+      }
+    }
+  };
+
+  Drupal.facets.addRangeDropdowns = function (facet, settings) {
+    var dropdown_min = '#' + facet + '_min';
+    var dropdown_max = '#' + facet + '_max';
+
+    function dropdownChanged(el) {
+      // If "min" dropdown is being changed.
+      if (el.val() == $(dropdown_min).val()) {
+        if ($(dropdown_min).val() > $(dropdown_max).val()) {
+          $(dropdown_max).val($(dropdown_min).val());
+        }
+      }
+      // If "max" dropdown is being changed.
+      else {
+        if ($(dropdown_min).val() > $(dropdown_max).val() && $(dropdown_max).val() != '') {
+          $(dropdown_min).val($(dropdown_max).val());
+        }
+      }
+      window.location.href = settings.url.replace('__range_slider_min__', $(dropdown_min).val()).replace('__range_slider_max__', $(dropdown_max).val());
+    }
+
+    $(dropdown_min + "," + dropdown_max).on('change', function(event) {
+      dropdownChanged($(this));
+    });
+  }
+
+})(jQuery);
diff --git a/modules/facets_range_widget/src/Plugin/facets/widget/RangeDropdownsWidget.php b/modules/facets_range_widget/src/Plugin/facets/widget/RangeDropdownsWidget.php
new file mode 100644
index 0000000..465d143
--- /dev/null
+++ b/modules/facets_range_widget/src/Plugin/facets/widget/RangeDropdownsWidget.php
@@ -0,0 +1,118 @@
+<?php
+
+namespace Drupal\facets_range_widget\Plugin\facets\widget;
+
+use Drupal\facets\FacetInterface;
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * The range dropdowns widget.
+ *
+ * @FacetsWidget(
+ *   id = "range_dropdowns",
+ *   label = @Translation("Range dropdowns"),
+ *   description = @Translation("A widget that shows range dropdowns."),
+ * )
+ */
+class RangeDropdownsWidget extends RangeSliderWidget {
+
+  /**
+   * {@inheritdoc}
+   */
+  public function defaultConfiguration() {
+    return [
+      'label_min' => '',
+      'label_max' => '',
+    ] + parent::defaultConfiguration();
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function buildConfigurationForm(array $form, FormStateInterface $form_state, FacetInterface $facet) {
+    $form = parent::buildConfigurationForm($form, $form_state, $facet);
+    $conf = $this->getConfiguration();
+
+    $form['label_min'] = [
+      '#type' => 'textfield',
+      '#title' => $this->t('Minimal value label'),
+      '#size' => 5,
+      '#default_value' => $conf['label_min'],
+    ];
+
+    $form['label_max'] = [
+      '#type' => 'textfield',
+      '#title' => $this->t('Maximum value label'),
+      '#size' => 5,
+      '#default_value' => $conf['label_max'],
+    ];
+
+    return $form;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function build(FacetInterface $facet) {
+    $build = parent::build($facet);
+    $conf = $facet->getWidgetInstance()->getConfiguration();
+
+    // Inherit slider settings.
+    $build['dropdowns'] = $build['slider'];
+    unset($build['slider']);
+
+    $build['#attached']['library'] = ['facets_range_widget/dropdowns'];
+    $facets_settings = &$build['#attached']['drupalSettings']['facets'];
+    $facets_settings['range_dropdowns'] = $facets_settings['sliders'];
+    unset($facets_settings['sliders']);
+
+    $facet_settings = &$facets_settings['range_dropdowns'][$facet->id()];
+
+    $results = $facet->getResults();
+    ksort($results);
+
+    $show_numbers = $conf['show_numbers'];
+    $urls = [];
+    $labels = [];
+
+    foreach ($results as $result) {
+      $urls['f_' . $result->getRawValue()] = $result->getUrl()->toString();
+      $labels[$result->getRawValue()] = $result->getDisplayValue() . ($show_numbers ? ' (' . $result->getCount() . ')' : '');
+    }
+
+    $active = $facet->getActiveItems();
+    $build['range_dropdowns'] = [
+      '#type' => 'container',
+      '#attributes' => [
+        'class' => ['facets-range-dropdowns-wrapper',],
+      ],
+      '#prefix' => $conf['prefix'],
+      '#suffix' => $conf['suffix'],
+      'dropdowns' => [
+        [
+          '#type' => 'select',
+          '#title' => $conf['label_min'],
+          '#options' => $labels,
+          '#value' => isset($active[0]) ? $active[0][0] : reset($results)->getRawValue(),
+          '#attributes' => [
+            'class' => ['facet-dropdown', 'facet-dropdown-min',],
+            'id' => $facet->id() . '_min',
+          ],
+        ],
+        [
+          '#type' => 'select',
+          '#title' => $conf['label_max'],
+          '#options' => $labels,
+          '#value' => isset($active[0]) ? $active[0][1] : end($results)->getRawValue(),
+          '#attributes' => [
+            'class' => ['facet-dropdown', 'facet-dropdown-max',],
+            'id' => $facet->id() . '_max',
+          ],
+        ],
+      ],
+    ];
+
+    return $build;
+  }
+
+}