diff --git a/demo/client/css/pathfinder.css b/demo/client/css/pathfinder.css
new file mode 100644
index 00000000..5d61d489
--- /dev/null
+++ b/demo/client/css/pathfinder.css
@@ -0,0 +1,26 @@
+body {
+    background: lightslategray;
+}
+.pf-bottom-control {
+    position: fixed;
+    bottom: 1em;
+}
+#pf-load-font-button-label,
+#pf-load-svg-button-label {
+    left: 1em;
+    margin: 0;
+}
+#pf-rendering-options-group {
+    right: 1em;
+}
+#pf-canvas {
+    display: block;
+    touch-action: none;
+}
+#pf-fps-label {
+    position: absolute;
+    right: 1em;
+    margin-top: 1em;
+    color: white;
+    background: rgba(0, 0, 0, 0.75);
+}
diff --git a/demo/client/html/svg.html b/demo/client/html/svg.html
new file mode 100644
index 00000000..cc2e3b26
--- /dev/null
+++ b/demo/client/html/svg.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>SVG &mdash; Pathfinder Demo</title>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
+        <link rel="stylesheet" href="/css/pathfinder.css">
+        <script type="text/javascript" src="js/jquery/jquery.js"></script>
+        <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
+        <script type="text/javascript" src="js/pathfinder.js"></script>
+    </head>
+    <body>
+        <nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
+            <a class="navbar-brand" href="#">Pathfinder</a>
+            <div class="collapse navbar-collapse">
+                <ul class="navbar-nav mr-auto">
+                    <li class="nav-item dropdown active">
+                        <a class="nav-link dropdown-toggle" id="pf-demos-menu"
+                         data-toggle="dropdown" ref="/" aria-haspopup="true"
+                         aria-expanded="false">Demos</a>
+                        <div class="dropdown-menu" aria-labelledby="pf-demos-menu">
+                            <a class="dropdown-item" href="/">Text</a>
+                            <a class="dropdown-item" href="/svg">SVG</a>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+        </nav>
+        <div class="rounded py-1 px-3" id="pf-fps-label">0 ms</div>
+        <canvas id="pf-canvas" width="400" height="300"></canvas>
+        <label class="btn btn-secondary btn-file pf-bottom-control" id="pf-load-svg-button-label">
+            Load SVG&hellip;
+            <input type="file" style="display: none" id="pf-load-svg-button">
+        </label>
+        <div class="pf-bottom-control" id="pf-rendering-options-group">
+            <select class="custom-select" id="pf-aa-level-select">
+                <option data-pf-type="none" data-pf-level="0" selected>No AA</option>
+                <option data-pf-type="ecaa" data-pf-level="0">ECAA</option>
+                <option data-pf-type="ssaa" data-pf-level="2">2&times;SSAA</option>
+                <option data-pf-type="ssaa" data-pf-level="4">4&times;SSAA</option>
+            </select>
+        </div>
+    </body>
+</html>
diff --git a/demo/client/index.html b/demo/client/html/text.html
similarity index 61%
rename from demo/client/index.html
rename to demo/client/html/text.html
index 3041fbff..dfa45f56 100644
--- a/demo/client/index.html
+++ b/demo/client/html/text.html
@@ -1,48 +1,28 @@
 <!DOCTYPE html>
 <html>
     <head>
-        <title>Pathfinder Demo</title>
+        <title>Text &mdash; Pathfinder Demo</title>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
         <link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
+        <link rel="stylesheet" href="/css/pathfinder.css">
         <script type="text/javascript" src="js/jquery/jquery.js"></script>
         <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
         <script type="text/javascript" src="js/pathfinder.js"></script>
-        <style type="text/css">
-            body {
-                background: lightslategray;
-            }
-            .pf-bottom-control {
-                position: fixed;
-                bottom: 1em;
-            }
-            #pf-load-font-button-label {
-                left: 1em;
-                margin: 0;
-            }
-            #pf-rendering-options-group {
-                right: 1em;
-            }
-            #pf-canvas {
-                display: block;
-                touch-action: none;
-            }
-            #pf-fps-label {
-                position: absolute;
-                right: 1em;
-                margin-top: 1em;
-                color: white;
-                background: rgba(0, 0, 0, 0.75);
-            }
-        </style>
     </head>
     <body>
         <nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
-            <a class="navbar-brand" href="#">Pathfinder Demo</a>
+            <a class="navbar-brand" href="#">Pathfinder</a>
             <div class="collapse navbar-collapse">
                 <ul class="navbar-nav mr-auto">
-                    <li class="nav-item active">
-                        <a class="nav-link" href="#">Text</a>
+                    <li class="nav-item dropdown active">
+                        <a class="nav-link dropdown-toggle" id="pf-demos-menu"
+                         data-toggle="dropdown" ref="/" aria-haspopup="true"
+                         aria-expanded="false">Demos</a>
+                        <div class="dropdown-menu" aria-labelledby="pf-demos-menu">
+                            <a class="dropdown-item" href="/">Text</a>
+                            <a class="dropdown-item" href="/svg">SVG</a>
+                        </div>
                     </li>
                 </ul>
             </div>
@@ -50,7 +30,7 @@
         <div class="rounded py-1 px-3" id="pf-fps-label">0 ms</div>
         <canvas id="pf-canvas" width="400" height="300"></canvas>
         <label class="btn btn-secondary btn-file pf-bottom-control" id="pf-load-font-button-label">
-            Load Font…
+            Load Font&hellip;
             <input type="file" style="display: none" id="pf-load-font-button">
         </label>
         <div class="pf-bottom-control" id="pf-rendering-options-group">
diff --git a/demo/server/src/main.rs b/demo/server/src/main.rs
index d3abec69..6a9c1f57 100644
--- a/demo/server/src/main.rs
+++ b/demo/server/src/main.rs
@@ -36,8 +36,10 @@ use std::io;
 use std::mem;
 use std::path::{Path, PathBuf};
 
-static STATIC_ROOT_PATH: &'static str = "../client/index.html";
+static STATIC_TEXT_DEMO_PATH: &'static str = "../client/html/text.html";
+static STATIC_SVG_DEMO_PATH: &'static str = "../client/html/svg.html";
 static STATIC_CSS_BOOTSTRAP_PATH: &'static str = "../client/node_modules/bootstrap/dist/css";
+static STATIC_CSS_PATHFINDER_PATH: &'static str = "../client/css/pathfinder.css";
 static STATIC_JS_BOOTSTRAP_PATH: &'static str = "../client/node_modules/bootstrap/dist/js";
 static STATIC_JS_JQUERY_PATH: &'static str = "../client/node_modules/jquery/dist";
 static STATIC_JS_PATHFINDER_JS_PATH: &'static str = "../client/pathfinder.js";
@@ -319,8 +321,12 @@ fn partition_font(request: Json<PartitionFontRequest>)
 
 // Static files
 #[get("/")]
-fn static_index() -> io::Result<NamedFile> {
-    NamedFile::open(STATIC_ROOT_PATH)
+fn static_text_demo() -> io::Result<NamedFile> {
+    NamedFile::open(STATIC_TEXT_DEMO_PATH)
+}
+#[get("/svg")]
+fn static_svg_demo() -> io::Result<NamedFile> {
+    NamedFile::open(STATIC_SVG_DEMO_PATH)
 }
 #[get("/js/pathfinder.js")]
 fn static_js_pathfinder_js() -> io::Result<NamedFile> {
@@ -330,6 +336,10 @@ fn static_js_pathfinder_js() -> io::Result<NamedFile> {
 fn static_css_bootstrap(file: PathBuf) -> Option<NamedFile> {
     NamedFile::open(Path::new(STATIC_CSS_BOOTSTRAP_PATH).join(file)).ok()
 }
+#[get("/css/pathfinder.css")]
+fn static_css_pathfinder_css() -> io::Result<NamedFile> {
+    NamedFile::open(STATIC_CSS_PATHFINDER_PATH)
+}
 #[get("/js/bootstrap/<file..>")]
 fn static_js_bootstrap(file: PathBuf) -> Option<NamedFile> {
     NamedFile::open(Path::new(STATIC_JS_BOOTSTRAP_PATH).join(file)).ok()
@@ -364,9 +374,11 @@ impl<'a> Responder<'a> for Shader {
 fn main() {
     rocket::ignite().mount("/", routes![
         partition_font,
-        static_index,
+        static_text_demo,
+        static_svg_demo,
         static_js_pathfinder_js,
         static_css_bootstrap,
+        static_css_pathfinder_css,
         static_js_bootstrap,
         static_js_jquery,
         static_glsl,
