diff --git a/RevisionSlider.hooks.php b/RevisionSlider.hooks.php
index 96fbd00e..fc49f619 100644
--- a/RevisionSlider.hooks.php
+++ b/RevisionSlider.hooks.php
@@ -120,8 +120,8 @@ class RevisionSliderHooks {
 			'label-message' => 'revisionslider-beta-feature-message',
 			'desc-message' => 'revisionslider-beta-feature-description',
 			'screenshot' => [
-				'ltr' => "$wgExtensionAssetsPath/RevisionSlider/resources/RevisionSlider-beta-features-ltr.png",
-				'rtl' => "$wgExtensionAssetsPath/RevisionSlider/resources/RevisionSlider-beta-features-rtl.png",
+				'ltr' => "$wgExtensionAssetsPath/RevisionSlider/resources/RevisionSlider-beta-features-ltr.svg",
+				'rtl' => "$wgExtensionAssetsPath/RevisionSlider/resources/RevisionSlider-beta-features-rtl.svg",
 			],
 			'info-link' => 'https://www.mediawiki.org/wiki/Extension:RevisionSlider',
 			'discussion-link' => 'https://www.mediawiki.org/wiki/Extension_talk:RevisionSlider',
diff --git a/resources/RevisionSlider-beta-features-ltr.png b/resources/RevisionSlider-beta-features-ltr.png
deleted file mode 100644
index ed4c2d85..00000000
Binary files a/resources/RevisionSlider-beta-features-ltr.png and /dev/null differ
diff --git a/resources/RevisionSlider-beta-features-ltr.svg b/resources/RevisionSlider-beta-features-ltr.svg
new file mode 100644
index 00000000..82696ca2
--- /dev/null
+++ b/resources/RevisionSlider-beta-features-ltr.svg
@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="264" height="162" viewBox="0 0 264 162" id="svg2">
+    <defs id="defs78">
+        <clipPath id="jagged-edge">
+            <path id="path6612" d="M0 0v152l12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10V0z"/>
+        </clipPath>
+    </defs>
+    <g id="screenshot" clip-path="url(#jagged-edge)">
+        <path fill="#fff" d="M263.5 162.25l-263-.5V.5h263z" id="background"/>
+        <path d="M250.87 162V75H48v87z" id="article" fill="#e5e5e5"/>
+        <path fill="#e5e5e5" d="M11 22c0-7.732 6.268-14 14-14s14 6.268 14 14-6.268 14-14 14-14-6.268-14-14z" id="logo"/>
+        <path fill="#e5e5e5" d="M38 163.807V58H13v105.807h25z" id="sidebar"/>
+        <g fill="#e5e5e5" id="personal-tools">
+            <path id="path6620" d="M233 5h26v6h-26V5zm-24 0h22v6h-22zm-24 0h22v6h-22zm-23 0h13v6h-13zm15 0h6v6h-6zm-23 0h6v6h-6z"/>
+        </g>
+        <g fill="#e5e5e5" id="search">
+            <path d="M258 16v4h-92v-4h92m1-1h-94v6h94v-6z" id="path5717"/>
+            <path d="M168 17h2v2h-2z" id="icon"/>
+        </g>
+        <path fill="#e5e5e5" d="M38 45v-5H13v5h25z" id="sitename"/>
+        <path fill="#e5e5e5" id="border" d="M0 0v162h264V0zm1 1h262v150.533l-11 9.166-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-11-9.168z"/>
+        <g id="g7240" fill="#36c" fill-rule="evenodd">
+            <path d="M63 49l11-11v22z" id="path7199" transform="translate(-2)"/>
+            <path d="M236 49l-11-11v22z" id="path7199-3" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7216" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M72 48.5h156.965v1H72z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7218" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M79 38h12v11H79z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7220" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M92 49h12v9H92z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7222" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M105 49h12v15h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7224" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M118 31h12v18h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7226" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M131 35h12v14h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7228" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M144 39h12v10h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7230" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M157 49h12v19h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7232" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M170 31h12v18h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7234" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M183 49h12v11h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7236" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M196 49h12v16h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7238" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M209 38h12v11h-12z" transform="translate(-2)"/>
+        </g>
+        <path id="rect7256" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 79h30v7H54z"/>
+        <path id="rect7260" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 91h84v4H54z"/>
+        <path id="rect7262" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 105h84v3H54z"/>
+        <path id="rect7264" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 114h58v3H54z"/>
+        <path id="rect7266" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 128h84v3H54z"/>
+        <path id="rect7268" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 136h84v3H54z"/>
+        <path id="rect7270" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 143h41v3H54z"/>
+        <path id="rect7272" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 79h30v6h-30z"/>
+        <path id="rect7274" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 91h84v3h-84z"/>
+        <path id="rect7276" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 98h84v3h-84z"/>
+        <path id="rect7278" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 105h29v3h-29z"/>
+        <path id="rect7280" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 114h84v3h-84z"/>
+        <path id="rect7289" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M147 75h3v85h-3z"/>
+        <path id="rect7306" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 121h84v3h-84z"/>
+        <path id="rect7308" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 128h84v3h-84z"/>
+        <path id="rect7310" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 143h84v3h-84z"/>
+    </g>
+</svg>
diff --git a/resources/RevisionSlider-beta-features-rtl.png b/resources/RevisionSlider-beta-features-rtl.png
deleted file mode 100644
index 5be6ab56..00000000
Binary files a/resources/RevisionSlider-beta-features-rtl.png and /dev/null differ
diff --git a/resources/RevisionSlider-beta-features-rtl.svg b/resources/RevisionSlider-beta-features-rtl.svg
new file mode 100644
index 00000000..15a9c44c
--- /dev/null
+++ b/resources/RevisionSlider-beta-features-rtl.svg
@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="264" height="162" viewBox="0 0 264 162" id="svg2">
+    <defs id="defs78">
+        <clipPath id="jagged-edge">
+            <path id="path6612" d="M0 0v152l12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10 12 10 12-10V0z"/>
+        </clipPath>
+    </defs>
+    <g transform="matrix(-1 0 0 1 264 0)" id="screenshot" clip-path="url(#jagged-edge)">
+        <path d="M263.5 162.25l-263-.5V.5h263z" id="background" fill="#fff"/>
+        <path d="M250.87 162V75H48v87z" id="article" fill="#e5e5e5"/>
+        <path d="M11 22c0-7.732 6.268-14 14-14s14 6.268 14 14-6.268 14-14 14-14-6.268-14-14z" id="logo" fill="#e5e5e5"/>
+        <path d="M38 163.807V58H13v105.807h25z" id="sidebar" fill="#e5e5e5"/>
+        <g id="personal-tools" fill="#e5e5e5">
+            <path id="path6620" d="M233 5h26v6h-26V5zm-24 0h22v6h-22zm-24 0h22v6h-22zm-23 0h13v6h-13zm15 0h6v6h-6zm-23 0h6v6h-6z"/>
+        </g>
+        <g id="search" fill="#e5e5e5">
+            <path d="M258 16v4h-92v-4h92m1-1h-94v6h94v-6z" id="path5717"/>
+            <path d="M168 17h2v2h-2z" id="icon"/>
+        </g>
+        <path d="M38 45v-5H13v5h25z" id="sitename" fill="#e5e5e5"/>
+        <path id="border" d="M0 0v162h264V0zm1 1h262v150.533l-11 9.166-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-12-10-12 10-11-9.168z" fill="#e5e5e5"/>
+        <g id="g7240" fill="#36c" fill-rule="evenodd">
+            <path d="M63 49l11-11v22z" id="path7199" transform="translate(-2)"/>
+            <path d="M236 49l-11-11v22z" id="path7199-3" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7216" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M72 48.5h156.965v1H72z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7218" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M79 38h12v11H79z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7220" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M92 49h12v9H92z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7222" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M105 49h12v15h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7224" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M118 31h12v18h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7226" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M131 35h12v14h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7228" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M144 39h12v10h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7230" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M157 49h12v19h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7232" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M170 31h12v18h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7234" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M183 49h12v11h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7236" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M196 49h12v16h-12z" transform="translate(-2)"/>
+            <path style="isolation:auto;mix-blend-mode:normal" id="rect7238" color="#000" overflow="visible" stroke-linecap="round" stroke-linejoin="round" d="M209 38h12v11h-12z" transform="translate(-2)"/>
+        </g>
+        <path id="rect7256" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 79h30v7H54z"/>
+        <path id="rect7260" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 91h84v4H54z"/>
+        <path id="rect7262" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 105h84v3H54z"/>
+        <path id="rect7264" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 114h58v3H54z"/>
+        <path id="rect7266" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 128h84v3H54z"/>
+        <path id="rect7268" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 136h84v3H54z"/>
+        <path id="rect7270" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M54 143h41v3H54z"/>
+        <path id="rect7272" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 79h30v6h-30z"/>
+        <path id="rect7274" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 91h84v3h-84z"/>
+        <path id="rect7276" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 98h84v3h-84z"/>
+        <path id="rect7278" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 105h29v3h-29z"/>
+        <path id="rect7280" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 114h84v3h-84z"/>
+        <path id="rect7289" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M147 75h3v85h-3z"/>
+        <path id="rect7306" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 121h84v3h-84z"/>
+        <path id="rect7308" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 128h84v3h-84z"/>
+        <path id="rect7310" style="isolation:auto;mix-blend-mode:normal" color="#000" overflow="visible" fill="#d8d8d8" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="M160 143h84v3h-84z"/>
+    </g>
+</svg>