diff --git a/.gitignore b/.gitignore
index fedb276ba98..31ac936c573 100644
--- a/.gitignore
+++ b/.gitignore
@@ -16,6 +16,7 @@ packages/components/Robot
 packages/components/SampleConfigurator
 packages/components/withGist
 packages/components/withLanguage
+packages/components/withStorage
 packages/components/Workbench
 packages/core/coverage
 packages/workbench
diff --git a/packages/components/src/Example/index.js b/packages/components/src/Example/index.js
index c5b631580eb..5a692bf5816 100644
--- a/packages/components/src/Example/index.js
+++ b/packages/components/src/Example/index.js
@@ -44,7 +44,11 @@ const Example = props => {
     rendertest,
     tutorial
   };
-  const settings = { options: { ...props.options } };
+  const settings = {
+    options: { ...props.options },
+    measurements: { headCircumference: 390 },
+    ...props.settings
+  };
   if (props.part !== "") settings.only = [props.part];
   const pattern = new patterns[props.pattern](settings);
 
diff --git a/packages/components/src/index.js b/packages/components/src/index.js
index 386cbfb0e9a..ad5d963450c 100644
--- a/packages/components/src/index.js
+++ b/packages/components/src/index.js
@@ -13,5 +13,6 @@ export default [
   "SampleConfigurator",
   "withGist",
   "withLanguage",
+  "withStorage",
   "Workbench"
 ];
diff --git a/packages/components/src/withStorage/index.js b/packages/components/src/withStorage/index.js
new file mode 100644
index 00000000000..5f771b817f7
--- /dev/null
+++ b/packages/components/src/withStorage/index.js
@@ -0,0 +1,43 @@
+import React from "react";
+import { storage } from "@freesewing/utils";
+
+const withStorage = (WrappedComponent, name) => {
+  return class extends React.Component {
+    constructor(props) {
+      super(props);
+      this.setStorageData = this.setStorageData.bind(this);
+      this.updateStorageData = this.updateStorageData.bind(this);
+      this.state = { data: storage.get(name) || {} };
+    }
+
+    setStorageData(data) {
+      storage.set(name, data);
+    }
+
+    updateStorageData(value, l1 = false, l2 = false, l3 = false) {
+      if (!l1) return;
+      let data = this.state.data;
+
+      if (l2 && typeof data[l1] === "undefined") data[l1] = {};
+      if (l3 && typeof data[l1][l2] === "undefined") data[l1][l2] = {};
+
+      if (l3) data[l1][l2][l3] = value;
+      else if (l2) data[l1][l2] = value;
+      else data[l1] = value;
+      this.setState({ data });
+      storage.set(name, data);
+    }
+
+    render() {
+      return (
+        <WrappedComponent
+          storageData={this.state.data}
+          updateStorageData={this.updateStorageData}
+          {...this.props}
+        />
+      );
+    }
+  };
+};
+
+export default withStorage;