diff --git a/.gitignore b/.gitignore
index 8fefd14..54c1503 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 node_modules/
 samples/*/
 jpc-like-websites.js
+extensions/
diff --git a/src/builder.js b/src/builder.js
index 8d88e6a..b9ca1fa 100644
--- a/src/builder.js
+++ b/src/builder.js
@@ -16,7 +16,10 @@ const builder = {
           openedChain: {}
      },
 
-     extended: {},
+     /**
+      * @type {Object}
+      */
+     extensions: {},
 
      /**
       * 
@@ -366,6 +369,7 @@ const builder = {
           main.parentElement.insertAdjacentElement(
                "afterbegin",
                builder.genTag("main")
+                    .isHigherComponent()
                     .alignment(Alignment.CENTER)
                     .arrangement(Arrangement.CENTER)
                     .childContext(innerComponents)
diff --git a/src/context.js b/src/context.js
index 0bb7320..d80c618 100644
--- a/src/context.js
+++ b/src/context.js
@@ -27,17 +27,21 @@ class PageBuilder extends ScriptAndStyleContext {
     /**
      * @type {boolean}
      */
-    _useCssCalc;
+    #showFrameworkConsole;
+    /**
+     * @type {Array<CompelExtension>}
+     */
+    _extensions;
 
     constructor() {
         super();
+        this.#showFrameworkConsole = false;
+
         this.#autoRegisteredComponents = [];
         this.#registeredComponents = [];
-        this._groups = new Map();
-    }
+        this._extensions = [];
 
-    useCssCalc() {
-        this._useCssCalc = true;
+        this._groups = new Map();
     }
 
     /**
@@ -162,7 +166,8 @@ class PageBuilder extends ScriptAndStyleContext {
      * @todo This method/feature will work only, if an automatic reuse logic for elements/components is implemented within the jpc lib.
      * @ATTENTION DO NOT USE
      */
-    packageWithoutFramework() {
+    enableFrameworkConsole() {
+        this.#showFrameworkConsole = true;
         return this;
     }
 
@@ -190,14 +195,39 @@ class PageBuilder extends ScriptAndStyleContext {
         head.insertAdjacentElement("beforeend", meta);
     }
 
-    generate() {
-        super.generate();
-        compelgroups = this._groups;
+    /**
+     * 
+     * @param {CompelExtension} extension 
+     */
+    addExtension(extension) {
+        if (extension instanceof CompelExtension) {
+            this._extensions.push(extension);
+            extension.install();
+        }
     }
 
+    setPageTitle(title) {
+        this._apptitle = title;
+        document.querySelector("title")
+            .innerText = title;
+    }
 
 
 
+    generate() {
+        super.generate();
+        if (this.#showFrameworkConsole) {
+            let pageContextControlPanel = frameworkControlPanel(this._extensions);
+            pageContextControlPanel = pageContextControlPanel.generate();
+
+            document.querySelector('body')
+                .insertAdjacentElement(
+                    "afterbegin",
+                    pageContextControlPanel.html
+                );
+        }
+        compelgroups = this._groups;
+    }
 
 }
 
diff --git a/src/context/framework-controls.js b/src/context/framework-controls.js
new file mode 100644
index 0000000..bef543d
--- /dev/null
+++ b/src/context/framework-controls.js
@@ -0,0 +1,63 @@
+/**
+ * 
+ */
+
+function frameworkControlPanel(
+    extensions = []
+) {
+    return builder.row()
+        .alignment(Alignment.CENTER)
+        .arrangement(Arrangement.CENTER)
+        .isHigherComponent()
+        .setStylingsStorage(ExtStoreType.INTERNALIZED_WITHIN)
+        .modifier(
+            new Modifier()
+                .fillMaxWidth()
+                .background(MaterialFiveHundredlColors.ORANGE)
+                .dimensions(
+                    new Dimensions()
+                        .height(200)
+                )
+                .border(
+                    new Border(3)
+                        .color(Colors.goldenrod_3)
+                )
+                .linkPadding(4)
+        )
+        .childContext([
+            builder.column()
+                .modifier(new Modifier().fillMaxHeight())
+                .childContext([
+                    builder.label().text("Installed Extensions:")
+                    ,
+                    builder.column()
+                        .overflow()
+                        .modifier(
+                            new Modifier()
+                                .linkPadding(4).ensureModifier()
+                                .linkBorder(1)
+                        )
+                        .childContext(
+                            extensions.map(
+                                /**
+                                 * 
+                                 * @param {CompelExtension} ext 
+                                 * @returns {Component}
+                                 */
+                                ext => builder.span().text(ext.diplayTitle)
+                            )
+                        )
+                ])
+            ,
+            builder.div()
+                .alignment(Alignment.CENTER)
+                .arrangement(Arrangement.CENTER)
+                .childContext([
+                    builder.label()
+                        .text("to generate and download page displayed below click on 'generate'")
+                    ,
+                    builder.button()
+                        .text("generate")
+                ])
+        ]);
+}
diff --git a/src/extensions/extension.js b/src/extensions/extension.js
new file mode 100644
index 0000000..2f3d17b
--- /dev/null
+++ b/src/extensions/extension.js
@@ -0,0 +1,44 @@
+class CompelExtension {
+    /**
+     * @type {string}
+     */
+    name;
+    /**
+     * @type {string}
+     */
+    diplayTitle;
+    /**
+     * @type {Array<SStoreDefinition>}
+     */
+    stylings;
+    /**
+     * @type {Array<SStoreDefinition>}
+     */
+    functions;
+    /**
+     * Predefined components. Usually of a higher (constructed) kind.
+     * @type {Object}
+     */
+    components;
+    /**
+     * Extensions for/to the Page or the framework in general. 
+     * @type {Object}
+     */
+    frameworkControls;
+    /**
+     * Additional elements for the builder (likely referencing components)
+     * @type {Object}
+     */
+    builderElements;
+
+    /**
+     * defines how jpc-like-websites is to be extended and executes that extension
+     */
+    install() {
+        builder.extensions = Object.assign(builder.extensions, this.builderElements);
+
+        for (const key of Object.keys(this.stylings)) {
+            Page.registerStyling(key, this.stylings[key]);
+        }
+    }
+}