diff --git a/core/modules/responsive_image/src/ResponsiveImageStyleForm.php b/core/modules/responsive_image/src/ResponsiveImageStyleForm.php
index 3badae1..69d648a 100644
--- a/core/modules/responsive_image/src/ResponsiveImageStyleForm.php
+++ b/core/modules/responsive_image/src/ResponsiveImageStyleForm.php
@@ -100,6 +100,17 @@ public function form(array $form, FormStateInterface $form_state) {
       '#options' => $this->breakpointManager->getGroups(),
       '#required' => TRUE,
       '#description' => $description,
+      '#ajax' => array(
+        'callback' => '::breakpointMappingFormAjax',
+        'wrapper' => 'responsive-image-style-breakpoints-wrapper',
+      ),
+    );
+
+    $form['keyed_styles'] = array(
+      '#type' => 'container',
+      '#attributes' => array(
+        'id' => 'responsive-image-style-breakpoints-wrapper',
+      ),
     );
 
     // By default, breakpoints are ordered from smallest weight to largest:
@@ -192,6 +203,13 @@ public function form(array $form, FormStateInterface $form_state) {
   }
 
   /**
+   * Get the form for mapping breakpoints to image styles.
+   */
+  public function breakpointMappingFormAjax($form, FormStateInterface $form_state) {
+    return $form['keyed_styles'];
+  }
+
+  /**
    * {@inheritdoc}
    */
   public function validateForm(array &$form, FormStateInterface $form_state) {