extlink.css                                        | 30 +++++++++++-----------
 extlink.js                                         |  5 ++--
 tests/src/FunctionalJavascript/ExtlinkTest.php     | 18 ++++++-------
 tests/src/FunctionalJavascript/ExtlinkTestBase.php | 10 ++++++++
 .../FunctionalJavascript/ExtlinkTestNoFollow.php   | 16 ++++++------
 .../src/FunctionalJavascript/ExtlinkTestTarget.php |  8 +++---
 6 files changed, 49 insertions(+), 38 deletions(-)

diff --git a/extlink.css b/extlink.css
index 8a9d71e..9647e02 100644
--- a/extlink.css
+++ b/extlink.css
@@ -1,22 +1,22 @@
-span.ext {
-  background: url(extlink_s.png) 2px center no-repeat;
-  width: 10px;
-  height: 10px;
-  padding-right: 12px;
-  text-decoration: none;
+svg.ext {
+  width: 14px;
+  height: 14px;
+  padding-right: 0.2em;
+  padding-left: 0.2em;
+  fill: #6f6f6f;
 }
-span.mailto {
-  background: url(extlink_s.png) -20px center no-repeat;
-  width: 10px;
-  height: 10px;
-  padding-right: 12px;
-  text-decoration: none;
+svg.mailto {
+  width: 14px;
+  height: 14px;
+  padding-right: 0.2em;
+  padding-left: 0.2em;
+  fill: #6f6f6f;
 }
 
-/* Hide the extra spans when printing. */
+/* Hide the extra icons when printing. */
 @media print {
-  span.ext,
-  span.mailto {
+  svg.ext,
+  svg.mailto {
     display: none;
     padding: 0;
   }
diff --git a/extlink.js b/extlink.js
index 19fecaa..c7c8aa1 100644
--- a/extlink.js
+++ b/extlink.js
@@ -214,10 +214,11 @@
       }
       else {
         if (class_name === drupalSettings.data.extlink.mailtoClass) {
-          $link[icon_placement]('<span class="' + class_name + '"><span class="visually-hidden">' + drupalSettings.data.extlink.mailtoLabel + '</span></span>');
+          $link[icon_placement]('<svg class="' + class_name + '" role="img" aria-labelledby="title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 80"><metadata><sfw xmlns="http://ns.adobe.com/SaveForWeb/1.0/"><sliceSourceBounds y="-8160" x="-8165" width="16389" height="16384" bottomLeftOrigin="true"/><optimizationSettings><targetSettings targetSettingsID="0" fileFormat="PNG24Format"><PNG24Format transparency="true" filtered="false" interlaced="false" noMatteColor="false" matteColor="#FFFFFF"/></targetSettings></optimizationSettings></sfw></metadata><title id="title">' + drupalSettings.data.extlink.mailtoLabel + '</title><path d="M56 14H8c-1.1 0-2 0.9-2 2v32c0 1.1 0.9 2 2 2h48c1.1 0 2-0.9 2-2V16C58 14.9 57.1 14 56 14zM50.5 18L32 33.4 13.5 18H50.5zM10 46V20.3l20.7 17.3C31.1 37.8 31.5 38 32 38s0.9-0.2 1.3-0.5L54 20.3V46H10z"/></svg>');
         }
         else {
-          $link[icon_placement]('<span class="' + class_name + '"><span class="visually-hidden">' + drupalSettings.data.extlink.extLabel + '</span></span>');
+          $link[icon_placement]('<svg class="' + class_name + '" role="img" aria-labelledby="title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 80"><metadata><sfw xmlns="http://ns.adobe.com/SaveForWeb/1.0/"><sliceSourceBounds y="-8160" x="-8165" width="16389" height="16384" bottomLeftOrigin="true"/><optimizationSettings><targetSettings targetSettingsID="0" fileFormat="PNG24Format"><PNG24Format transparency="true" filtered="false" interlaced="false" noMatteColor="false" matteColor="#FFFFFF"/></targetSettings></optimizationSettings></sfw></metadata><title id="title">' + drupalSettings.data.extlink.extLabel + '</title><path d="M48 26c-1.1 0-2 0.9-2 2v26H10V18h26c1.1 0 2-0.9 2-2s-0.9-2-2-2H8c-1.1 0-2 0.9-2 2v40c0 1.1 0.9 2 2 2h40c1.1 0 2-0.9 2-2V28C50 26.9 49.1 26 48 26z"/><path d="M56 6H44c-1.1 0-2 0.9-2 2s0.9 2 2 2h7.2L30.6 30.6c-0.8 0.8-0.8 2 0 2.8C31 33.8 31.5 34 32 34s1-0.2 1.4-0.6L54 12.8V20c0 1.1 0.9 2 2 2s2-0.9 2-2V8C58 6.9 57.1 6 56 6z"/></svg>');
+          
         }
       }
     }
diff --git a/tests/src/FunctionalJavascript/ExtlinkTest.php b/tests/src/FunctionalJavascript/ExtlinkTest.php
index 6e9ca14..6f83289 100644
--- a/tests/src/FunctionalJavascript/ExtlinkTest.php
+++ b/tests/src/FunctionalJavascript/ExtlinkTest.php
@@ -10,7 +10,7 @@ namespace Drupal\Tests\extlink\FunctionalJavascript;
 class ExtlinkTest extends ExtlinkTestBase {
 
   /**
-   * Checks to see if external link gets extlink span.
+   * Checks to see if external link gets extlink svg.
    */
   public function testExtlink() {
     // Login.
@@ -37,12 +37,12 @@ class ExtlinkTest extends ExtlinkTestBase {
     $this->assertTrue($page->hasLink('Google!'));
     $this->assertTrue($page->hasLink('Send Mail'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(!is_null($externalLink) && $externalLink->isVisible(), 'External Link Exists.');
 
-    // Test that the page has the Mailto external link span.
-    $mailToLink = $page->find('css', 'span.mailto');
+    // Test that the page has the Mailto external link svg.
+    $mailToLink = $page->find('xpath', EXTLINK_MAILTO_XPATH);
     $this->assertTrue(!is_null($mailToLink) && $mailToLink->isVisible(), 'External Link MailTo Exists.');
   }
 
@@ -78,12 +78,12 @@ class ExtlinkTest extends ExtlinkTestBase {
     $this->assertTrue($page->hasLink('Google!'));
     $this->assertTrue($page->hasLink('Send Mail'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(is_null($externalLink), 'External Link does not exist.');
 
-    // Test that the page has the Mailto external link span.
-    $mailToLink = $page->find('css', 'span.mailto');
+    // Test that the page has the Mailto external link svg.
+    $mailToLink = $page->find('xpath', EXTLINK_MAILTO_XPATH);
     $this->assertTrue(is_null($mailToLink), 'External Link MailTo does not exist.');
   }
 
diff --git a/tests/src/FunctionalJavascript/ExtlinkTestBase.php b/tests/src/FunctionalJavascript/ExtlinkTestBase.php
index 6c6c4b0..c51632a 100644
--- a/tests/src/FunctionalJavascript/ExtlinkTestBase.php
+++ b/tests/src/FunctionalJavascript/ExtlinkTestBase.php
@@ -43,6 +43,16 @@ abstract class ExtlinkTestBase extends JavascriptTestBase {
    */
   const EXTLINK_ADMIN_PATH = 'admin/config/user-interface/extlink';
 
+  /**
+   * Xpath for External Links link class.
+   */
+  const EXTLINK_EXT_XPATH = '//*[local-name() = "svg" and @class="ext"]';
+  
+  /**
+   * Xpath for External Links Mailto class.
+   */
+  const EXTLINK_MAILTO_XPATH = '//*[local-name() = "svg" and @class="mailto"]';
+  
   /**
    * {@inheritdoc}
    */
diff --git a/tests/src/FunctionalJavascript/ExtlinkTestNoFollow.php b/tests/src/FunctionalJavascript/ExtlinkTestNoFollow.php
index 41164f7..33acb0b 100644
--- a/tests/src/FunctionalJavascript/ExtlinkTestNoFollow.php
+++ b/tests/src/FunctionalJavascript/ExtlinkTestNoFollow.php
@@ -39,8 +39,8 @@ class ExtlinkTestNoFollow extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(!is_null($externalLink) && $externalLink->isVisible(), 'External Link does not exist.');
 
     // Does the anchor tag have no follow?
@@ -81,8 +81,8 @@ class ExtlinkTestNoFollow extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(is_null($externalLink), 'External Link exists.');
 
     // Does the anchor tag have no follow?
@@ -124,8 +124,8 @@ class ExtlinkTestNoFollow extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page doesn't have the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page doesn't have the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(is_null($externalLink), 'External Link exists.');
 
     // Check for no 'nofollow'.
@@ -164,8 +164,8 @@ class ExtlinkTestNoFollow extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(!is_null($externalLink) && $externalLink->isVisible(), 'External Link does not exist.');
 
     // Does the anchor tag have no follow?
diff --git a/tests/src/FunctionalJavascript/ExtlinkTestTarget.php b/tests/src/FunctionalJavascript/ExtlinkTestTarget.php
index b7270c3..c7122a0 100644
--- a/tests/src/FunctionalJavascript/ExtlinkTestTarget.php
+++ b/tests/src/FunctionalJavascript/ExtlinkTestTarget.php
@@ -39,8 +39,8 @@ class ExtlinkTestTarget extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(!is_null($externalLink) && $externalLink->isVisible(), 'External Link does not exist.');
     $link = $page->findLink('Google!');
 
@@ -82,8 +82,8 @@ class ExtlinkTestTarget extends ExtlinkTestBase {
     $this->assertSession()->statusCodeEquals(200);
     $this->assertTrue($page->hasLink('Google!'));
 
-    // Test that the page has the external link span.
-    $externalLink = $page->find('css', 'span.ext');
+    // Test that the page has the external link svg.
+    $externalLink = $page->find('xpath', EXTLINK_EXT_XPATH);
     $this->assertTrue(!is_null($externalLink) && $externalLink->isVisible(), 'External Link does not exist.');
     $link = $page->findLink('Google!');