diff --git a/packages/plugin-theme/.gitignore b/packages/plugin-theme/.gitignore
index ad46b30886f..c63527f20c2 100644
--- a/packages/plugin-theme/.gitignore
+++ b/packages/plugin-theme/.gitignore
@@ -1,3 +1,4 @@
+dist
 # Logs
 logs
 *.log
diff --git a/packages/plugin-theme/dist/browser.js b/packages/plugin-theme/dist/browser.js
deleted file mode 100644
index a0cfe8691ae..00000000000
--- a/packages/plugin-theme/dist/browser.js
+++ /dev/null
@@ -1,24 +0,0 @@
-/**
- * @freesewing/plugin-theme | v0.3.0
- * A freesewing plugin that provides a default theme
- * (c) 2018 Joost De Cock <joost@decock.org> (https://github.com/joostdecock)
- * @license MIT
- */
-(this.freesewing = this.freesewing || {}),
-  (this.freesewing.plugins = this.freesewing.plugins || {}),
-  (this.freesewing.plugins.theme = (function() {
-    "use strict";
-    return {
-      hooks: {
-        preRenderSvg: function(t) {
-          (this.style +=
-            'path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}path.fabric{stroke-width:.6;stroke:#653f95}path.lining{stroke-width:.6;stroke:#0275d8}path.interfacing{stroke-width:.6;stroke:#d9534f}path.canvas{stroke-width:.6;stroke:#5cb85c}path.various{stroke-width:.6;stroke:#5bc0de}path.sa{stroke-dasharray:.4,.8}path.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}path.hint{stroke-width:.2;stroke-dasharray:.4,.8}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-center{text-anchor:middle}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.dotted{stroke-dasharray:.4,.8}.hidden{stroke:none;fill:none}'),
-            (this.defs +=
-              '<g id="notch"><circle cy="0" cx="0" r="1.4" class="fill-mark" /><circle cy="0" cx="0" r="2.8" class="stroke-mark stroke-xl" /></g>' +
-              logo),
-            this.attributes.add("freesewing:plugin-theme", "0.3.0"),
-            t();
-        }
-      }
-    };
-  })());
diff --git a/packages/plugin-theme/dist/node.js b/packages/plugin-theme/dist/node.js
deleted file mode 100644
index 761f8ef6f70..00000000000
--- a/packages/plugin-theme/dist/node.js
+++ /dev/null
@@ -1,23 +0,0 @@
-/**
- * @freesewing/plugin-theme | v0.3.0
- * A freesewing plugin that provides a default theme
- * (c) 2018 Joost De Cock <joost@decock.org> (https://github.com/joostdecock)
- * @license MIT
- */
-"use strict";
-var style =
-    'path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}path.fabric{stroke-width:.6;stroke:#653f95}path.lining{stroke-width:.6;stroke:#0275d8}path.interfacing{stroke-width:.6;stroke:#d9534f}path.canvas{stroke-width:.6;stroke:#5cb85c}path.various{stroke-width:.6;stroke:#5bc0de}path.sa{stroke-dasharray:.4,.8}path.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}path.hint{stroke-width:.2;stroke-dasharray:.4,.8}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-center{text-anchor:middle}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.dotted{stroke-dasharray:.4,.8}.hidden{stroke:none;fill:none}',
-  snippets =
-    '<g id="notch"><circle cy="0" cx="0" r="1.4" class="fill-mark" /><circle cy="0" cx="0" r="2.8" class="stroke-mark stroke-xl" /></g>',
-  version = "0.3.0",
-  index = {
-    hooks: {
-      preRenderSvg: function(t) {
-        (this.style += style),
-          (this.defs += snippets + logo),
-          this.attributes.add("freesewing:plugin-theme", version),
-          t();
-      }
-    }
-  };
-module.exports = index;
diff --git a/packages/plugin-theme/img/example.png b/packages/plugin-theme/img/example.png
new file mode 100644
index 00000000000..146ea720ba5
Binary files /dev/null and b/packages/plugin-theme/img/example.png differ
diff --git a/packages/plugin-theme/src/index.js b/packages/plugin-theme/src/index.js
index 5681358f373..d8f4573fbb2 100644
--- a/packages/plugin-theme/src/index.js
+++ b/packages/plugin-theme/src/index.js
@@ -6,7 +6,7 @@ export default {
   hooks: {
     preRenderSvg: function(next) {
       this.style += style;
-      this.defs += snippets + logo;
+      this.defs += snippets;
       this.attributes.add("freesewing:plugin-theme", version);
       next();
     }
diff --git a/packages/plugin-theme/src/lib/style.css b/packages/plugin-theme/src/lib/style.css
index 1c4ee9bcf18..34991cbf0a1 100644
--- a/packages/plugin-theme/src/lib/style.css
+++ b/packages/plugin-theme/src/lib/style.css
@@ -1,21 +1,28 @@
 path,circle,rect{fill:none;stroke:none}
 path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}
-path.fabric{stroke-width:.6;stroke:#653f95}
-path.lining{stroke-width:.6;stroke:#0275d8}
-path.interfacing{stroke-width:.6;stroke:#d9534f}
-path.canvas{stroke-width:.6;stroke:#5cb85c}
-path.various{stroke-width:.6;stroke:#5bc0de}
+.fabric{stroke-width:.6;stroke:#212121}
+.lining{stroke-width:.6;stroke:#ff5b77}
+.interfacing{stroke-width:.6;stroke:#64b5f6}
+.canvas{stroke-width:.6;stroke:#ff9000}
+.various{stroke-width:.6;stroke:#4caf50}
+.note{stroke-width:.4;stroke:#dd60dd}
 
-path.sa{stroke-dasharray:0.4,0.8}
-path.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}
-path.hint{stroke-width:.2;stroke-dasharray:0.4,0.8}
+.fill-fabric{fill:#212121}
+.fill-lining{fill:#ff5b77}
+.fill-interfacing{fill:#64b5f6}
+.fill-canvas{fill:#ff9000}
+.fill-various{fill:#4caf50}
+.fill-note{fill:#dd69dd}
 
-text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200}
+text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200;dominant-baseline:ideographic;}
 .text-xs{font-size:3px}
 .text-sm{font-size:4px}
 .text-lg{font-size:7px}
 .text-xl{font-size:9px}
-.text-center{text-anchor:middle}
+.text-xxl{font-size:12px}
+
+.center{text-anchor:middle}
+.right{text-anchor:end}
 
 .stroke-xs{stroke-width:.1}
 .stroke-sm{stroke-width:.2}
@@ -23,7 +30,9 @@ text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe
 .stroke-xl{stroke-width:1}
 .stroke-xxl{stroke-width:2}
 
+.sa{stroke-dasharray:0.4,0.8}
+.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}
+.dotted{stroke-dasharray:0.4,0.8}
 .dashed{stroke-dasharray:1,1.5}
 .lashed{stroke-dasharray:6,6}
-.dotted{stroke-dasharray:0.4,0.8}
 .hidden{stroke:none;fill:none}
diff --git a/packages/plugin-theme/src/lib/style.js b/packages/plugin-theme/src/lib/style.js
index 5c33e95f110..626eeca7263 100644
--- a/packages/plugin-theme/src/lib/style.js
+++ b/packages/plugin-theme/src/lib/style.js
@@ -1 +1 @@
-export default `path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}path.fabric{stroke-width:.6;stroke:#653f95}path.lining{stroke-width:.6;stroke:#0275d8}path.interfacing{stroke-width:.6;stroke:#d9534f}path.canvas{stroke-width:.6;stroke:#5cb85c}path.various{stroke-width:.6;stroke:#5bc0de}path.sa{stroke-dasharray:.4,.8}path.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}path.hint{stroke-width:.2;stroke-dasharray:.4,.8}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-center{text-anchor:middle}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.dotted{stroke-dasharray:.4,.8}.hidden{stroke:none;fill:none}`;
+export default `path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}.fabric{stroke-width:.6;stroke:#212121}.lining{stroke-width:.6;stroke:#ff5b77}.interfacing{stroke-width:.6;stroke:#64b5f6}.canvas{stroke-width:.6;stroke:#ff9000}.various{stroke-width:.6;stroke:#4caf50}.note{stroke-width:.4;stroke:#dd60dd}.fill-fabric{fill:#212121}.fill-lining{fill:#ff5b77}.fill-interfacing{fill:#64b5f6}.fill-canvas{fill:#ff9000}.fill-various{fill:#4caf50}.fill-note{fill:#dd69dd}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200;dominant-baseline:ideographic}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-xxl{font-size:12px}.center{text-anchor:middle}.right{text-anchor:end}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.sa{stroke-dasharray:.4,.8}.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}.dotted{stroke-dasharray:.4,.8}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.hidden{stroke:none;fill:none}`;
diff --git a/packages/plugin-theme/src/lib/style.min.css b/packages/plugin-theme/src/lib/style.min.css
index f8ce5c3b59d..8c07ae09851 100644
--- a/packages/plugin-theme/src/lib/style.min.css
+++ b/packages/plugin-theme/src/lib/style.min.css
@@ -1 +1 @@
-path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}path.fabric{stroke-width:.6;stroke:#653f95}path.lining{stroke-width:.6;stroke:#0275d8}path.interfacing{stroke-width:.6;stroke:#d9534f}path.canvas{stroke-width:.6;stroke:#5cb85c}path.various{stroke-width:.6;stroke:#5bc0de}path.sa{stroke-dasharray:.4,.8}path.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}path.hint{stroke-width:.2;stroke-dasharray:.4,.8}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-center{text-anchor:middle}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.dotted{stroke-dasharray:.4,.8}.hidden{stroke:none;fill:none}
+path,circle,rect{fill:none;stroke:none}path{stroke:#000;stroke-opacity:1;stroke-width:.3;stroke-linecap:round;stroke-linejoin:round}.fabric{stroke-width:.6;stroke:#212121}.lining{stroke-width:.6;stroke:#ff5b77}.interfacing{stroke-width:.6;stroke:#64b5f6}.canvas{stroke-width:.6;stroke:#ff9000}.various{stroke-width:.6;stroke:#4caf50}.note{stroke-width:.4;stroke:#dd60dd}.fill-fabric{fill:#212121}.fill-lining{fill:#ff5b77}.fill-interfacing{fill:#64b5f6}.fill-canvas{fill:#ff9000}.fill-various{fill:#4caf50}.fill-note{fill:#dd69dd}text{font-size:5px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;fill:#000;text-anchor:start;font-weight:200;dominant-baseline:ideographic}.text-xs{font-size:3px}.text-sm{font-size:4px}.text-lg{font-size:7px}.text-xl{font-size:9px}.text-xxl{font-size:12px}.center{text-anchor:middle}.right{text-anchor:end}.stroke-xs{stroke-width:.1}.stroke-sm{stroke-width:.2}.stroke-lg{stroke-width:.6}.stroke-xl{stroke-width:1}.stroke-xxl{stroke-width:2}.sa{stroke-dasharray:.4,.8}.help{stroke-width:.2;stroke-dasharray:15,1.5,1,1.5}.dotted{stroke-dasharray:.4,.8}.dashed{stroke-dasharray:1,1.5}.lashed{stroke-dasharray:6,6}.hidden{stroke:none;fill:none}