diff --git a/core/modules/image/image.module b/core/modules/image/image.module
index 7f8314a..f9dbf41 100644
--- a/core/modules/image/image.module
+++ b/core/modules/image/image.module
@@ -295,10 +295,28 @@ function template_preprocess_image_style(&$variables) {
     '#width' => $dimensions['width'],
     '#height' => $dimensions['height'],
     '#attributes' => $variables['attributes'],
-    '#uri' => $style->buildUrl($variables['uri']),
     '#style_name' => $variables['style_name'],
   );
 
+  // If the current image toolkit supports this file type, prepare the URI for
+  // the derivative image. If not, just use the original image resized to the
+  // dimensions specified by the style.
+  if ($style->supportsUri($variables['uri'])) {
+    $variables['image']['#uri'] = $style->buildUrl($variables['uri']);
+  }
+  else {
+    $variables['image']['#uri'] = $variables['uri'];
+    // Don't render the image by default, but allow other preprocess functions
+    // to override that if they need to.
+    $variables['image']['#access'] = FALSE;
+
+    // Inform the site builders why their image didn't work.
+    \Drupal::logger('image')->warning('Could not apply @style image style @uri because the style does not support it.', [
+      '@style' => $style->label(),
+      '@uri' => $variables['uri'],
+    ]);
+  }
+
   if (isset($variables['alt']) || array_key_exists('alt', $variables)) {
     $variables['image']['#alt'] = $variables['alt'];
   }
diff --git a/core/modules/image/src/Entity/ImageStyle.php b/core/modules/image/src/Entity/ImageStyle.php
index e72258d..08fb115 100644
--- a/core/modules/image/src/Entity/ImageStyle.php
+++ b/core/modules/image/src/Entity/ImageStyle.php
@@ -343,6 +343,19 @@ public function deleteImageEffect(ImageEffectInterface $effect) {
   /**
    * {@inheritdoc}
    */
+  public function supportsUri($uri) {
+    // Only support the URI if its extension is supported by the current image
+    // toolkit.
+    return in_array(
+      pathinfo($uri, PATHINFO_EXTENSION),
+      // @todo Inject the image.factory service.
+      \Drupal::service('image.factory')->getSupportedExtensions()
+    );
+  }
+
+  /**
+   * {@inheritdoc}
+   */
   public function getEffect($effect) {
     return $this->getEffects()->get($effect);
   }
diff --git a/core/modules/image/src/ImageStyleInterface.php b/core/modules/image/src/ImageStyleInterface.php
index 89fd060..cf78b0d 100644
--- a/core/modules/image/src/ImageStyleInterface.php
+++ b/core/modules/image/src/ImageStyleInterface.php
@@ -194,4 +194,15 @@ public function addImageEffect(array $configuration);
    */
   public function deleteImageEffect(ImageEffectInterface $effect);
 
+  /**
+   * Determines if this style can be applied to a given image.
+   *
+   * @param string $uri
+   *   The URI of the image.
+   *
+   * @return boolean
+   *   TRUE if the image is supported, FALSE otherwise.
+   */
+  public function supportsUri($uri);
+
 }
diff --git a/core/modules/image/tests/src/Kernel/ImageFormatterTest.php b/core/modules/image/tests/src/Kernel/ImageFormatterTest.php
index d1b132e..67f3f27 100644
--- a/core/modules/image/tests/src/Kernel/ImageFormatterTest.php
+++ b/core/modules/image/tests/src/Kernel/ImageFormatterTest.php
@@ -4,9 +4,12 @@
 
 use Drupal\Component\Utility\Unicode;
 use Drupal\Core\Field\FieldStorageDefinitionInterface;
+use Drupal\Core\Render\Element;
 use Drupal\entity_test\Entity\EntityTest;
 use Drupal\field\Entity\FieldConfig;
 use Drupal\field\Entity\FieldStorageConfig;
+use Drupal\file\Entity\File;
+use Drupal\image\Entity\ImageStyle;
 use Drupal\Tests\field\Kernel\FieldKernelTestBase;
 
 /**
@@ -84,7 +87,7 @@ protected function setUp() {
   /**
    * Tests the cache tags from image formatters.
    */
-  function testImageFormatterCacheTags() {
+  public function testImageFormatterCacheTags() {
     // Create a test entity with the image field set.
     $entity = EntityTest::create([
       'name' => $this->randomMachineName(),
@@ -99,4 +102,89 @@ function testImageFormatterCacheTags() {
     $this->assertEquals($entity->{$this->fieldName}[1]->entity->getCacheTags(), $build[$this->fieldName][1]['#cache']['tags'], 'Second image cache tags is as expected');
   }
 
+  /**
+   * Tests ImageFormatter's handling of SVG images.
+   *
+   * @requires extension gd
+   */
+  public function testImageFormatterSvg() {
+    // Install the default image styles.
+    $this->installConfig(['image']);
+
+    /** @var \Drupal\Core\Render\RendererInterface $renderer */
+    $renderer = $this->container->get('renderer');
+
+    $png = File::create([
+      'uri' => 'public://test-image.png',
+    ]);
+    $png->save();
+
+    // We need to create an actual empty PNG, or the GD toolkit will not
+    // consider the image valid.
+    $png_resource = imagecreate(300, 300);
+    imagefill($png_resource, 0, 0, imagecolorallocate($png_resource, 0, 0, 0));
+    imagepng($png_resource, $png->getFileUri());
+
+    $svg = File::create([
+      'uri' => 'public://test-image.svg',
+    ]);
+    $svg->save();
+    // We don't have to put any real SVG data in here, because the GD toolkit
+    // won't be able to load it anyway.
+    touch($svg->getFileUri());
+
+    $entity = EntityTest::create([
+      'name' => $this->randomMachineName(),
+      $this->fieldName => [$png, $svg],
+    ]);
+    $entity->save();
+
+    // Ensure that the display is using the medium image style.
+    $component = $this->display->getComponent($this->fieldName);
+    $component['settings']['image_style'] = 'medium';
+    $this->display->setComponent($this->fieldName, $component)->save();
+
+    $build = $this->display->build($entity);
+
+    // The first image is a PNG, so it is supported by the GD image toolkit.
+    // The image style should be applied with its cache tags, image derivative
+    // computed with its URI and dimensions.
+    $this->assertCacheTags($build[$this->fieldName][0], ImageStyle::load('medium')->getCacheTags());
+    $renderer->renderRoot($build[$this->fieldName][0]);
+    $this->assertEquals('medium', $build[$this->fieldName][0]['#image_style']);
+    // We check that the image URL contains the expected style directory
+    // structure.
+    $this->assertTrue(strpos($build[$this->fieldName][0]['#markup'], 'styles/medium/public/test-image.png') !== FALSE);
+    $this->assertTrue(strpos($build[$this->fieldName][0]['#markup'], 'width="220"') !== FALSE);
+    $this->assertTrue(strpos($build[$this->fieldName][0]['#markup'], 'height="220"') !== FALSE);
+
+    // The second image is an SVG, which is not supported by the GD toolkit.
+    // The image style should still be applied with its cache tags, but image
+    // derivative will not be available so <img> tag will point to the original
+    // image.
+    $this->assertCacheTags($build[$this->fieldName][1], ImageStyle::load('medium')->getCacheTags());
+    $renderer->renderRoot($build[$this->fieldName][1]);
+    $this->assertEquals('medium', $build[$this->fieldName][1]['#image_style']);
+    // We check that the image URL does not contain the style directory
+    // structure.
+    $this->assertFalse(strpos($build[$this->fieldName][1]['#markup'], 'styles/medium/public/test-image.svg'));
+    // Since we did not store original image dimensions, width and height
+    // HTML attributes will not be present.
+    $this->assertFalse(strpos($build[$this->fieldName][1]['#markup'], 'width'));
+    $this->assertFalse(strpos($build[$this->fieldName][1]['#markup'], 'height'));
+  }
+
+  /**
+   * Asserts that a renderable array has a set of cache tags.
+   *
+   * @param array $renderable
+   *   The renderable array. Must have a #cache[tags] element.
+   * @param array $cache_tags
+   *   The expected cache tags.
+   */
+  protected function assertCacheTags(array $renderable, array $cache_tags) {
+    $diff = array_diff($cache_tags, $renderable['#cache']['tags']);
+    $this->assertEmpty($diff);
+  }
+
 }