diff --git a/demo/assets/dbp-toolkit-demo.topic.metadata.json.ejs b/demo/assets/dbp-toolkit-demo.topic.metadata.json.ejs
index 40ff1bb109e0d97677199a9721c43116d41d81a0..f86f492048b4b4bcef28cf9bf9b4b5be90868a27 100644
--- a/demo/assets/dbp-toolkit-demo.topic.metadata.json.ejs
+++ b/demo/assets/dbp-toolkit-demo.topic.metadata.json.ejs
@@ -15,7 +15,8 @@
   "activities": [
     {"path": "person-select.metadata.json"},
     {"path": "knowledge-base-web-page-element-view.metadata.json"},
-    {"path": "common.metadata.json"}
+    {"path": "common.metadata.json"},
+    {"path": "qr-code-scanner.metadata.json"}
   ],
   "attributes": []
 }
\ No newline at end of file
diff --git a/demo/assets/qr-code-scanner.metadata.json b/demo/assets/qr-code-scanner.metadata.json
new file mode 100644
index 0000000000000000000000000000000000000000..18a0fa4e481297a6f518bec70791be9ed0848afe
--- /dev/null
+++ b/demo/assets/qr-code-scanner.metadata.json
@@ -0,0 +1,17 @@
+{
+  "element": "dbp-qr-code-scanner-demo-activity",
+  "module_src": "dbp-qr-code-scanner-demo-activity.js",
+  "routing_name": "qr-code-scanner",
+  "name": {
+    "de": "QR Code Scanner",
+    "en": "QR Code Scanner"
+  },
+  "short_name": {
+    "de": "QR Code Scanner",
+    "en": "QR Code Scanner"
+  },
+  "description": {
+    "de": "Scannt Qr Codes",
+    "en": "Scans Qr Codes"
+  }
+}
diff --git a/demo/rollup.config.js b/demo/rollup.config.js
index d38a39d5b57297c5e353df6f34950807efeec509..2a2dbae9d2a441fba33b90930d1f0e5323408b19 100644
--- a/demo/rollup.config.js
+++ b/demo/rollup.config.js
@@ -23,7 +23,7 @@ import selfsigned from 'selfsigned';
 // Some new web APIs are only available when HTTPS is active.
 // Note that this only works with a Non-HTTPS API endpoint with Chrome,
 // Firefox will emit CORS errors, see https://bugzilla.mozilla.org/show_bug.cgi?id=1488740
-const USE_HTTPS = false;
+const USE_HTTPS = true;
 
 // -------------------------------
 
diff --git a/demo/src/dbp-qr-code-scanner-demo-activity.js b/demo/src/dbp-qr-code-scanner-demo-activity.js
new file mode 100644
index 0000000000000000000000000000000000000000..400fc110f036db5e1d33063e64e2a94a9ccdbd69
--- /dev/null
+++ b/demo/src/dbp-qr-code-scanner-demo-activity.js
@@ -0,0 +1,50 @@
+import {css, html, LitElement} from 'lit-element';
+import {ScopedElementsMixin} from '@open-wc/scoped-elements';
+import * as PersonSelectDemo from 'dbp-qr-code-scanner/src/dbp-qr-code-scanner-demo';
+import * as commonUtils from 'dbp-common/utils';
+import * as commonStyles from 'dbp-common/styles';
+import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
+import readme from 'dbp-qr-code-scanner/README.md';
+import highlightCSSPath from 'highlight.js/styles/default.css';
+
+class DbpQrCodeScannerDemoActivity extends ScopedElementsMixin(LitElement) {
+    static get scopedElements() {
+        return {
+            'dbp-person-select-demo': PersonSelectDemo,
+        };
+    }
+
+    static get properties() {
+        return {
+        };
+    }
+
+    connectedCallback() {
+        super.connectedCallback();
+
+        this.updateComplete.then(()=>{
+        });
+    }
+
+    static get styles() {
+        // language=css
+        return [
+            commonStyles.getThemeCSS(),
+            commonStyles.getGeneralCSS(),
+            css`
+            h1.title {margin-bottom: 1em;}
+            div.container {margin-bottom: 1.5em;}
+            `
+        ];
+    }
+
+    render() {
+        return html`
+            xxx
+            <dbp-qr-code-scanner-demo lang="en"></dbp-qr-code-scanner-demo>
+            ${unsafeHTML(readme)}
+        `;
+    }
+}
+
+commonUtils.defineCustomElement('dbp-qr-code-scanner-demo-activity', DbpQrCodeScannerDemoActivity);