diff --git a/package-lock.json b/package-lock.json
index 5cd4abfe..2684398b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "fuse",
-  "version": "6.2.1",
+  "version": "6.2.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index f007e30f..aad07bb5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "fuse",
-  "version": "6.2.1",
+  "version": "6.2.2",
   "license": "https://themeforest.net/licenses/terms/regular",
   "scripts": {
     "ng": "ng",
diff --git a/src/@fuse/components/theme-options/theme-options.component.html b/src/@fuse/components/theme-options/theme-options.component.html
index 00a10741..fa2bd51b 100644
--- a/src/@fuse/components/theme-options/theme-options.component.html
+++ b/src/@fuse/components/theme-options/theme-options.component.html
@@ -132,6 +132,23 @@
 
                     </div>
 
+                    <!-- SIDE PANEL -->
+                    <div class="group" formGroupName="sidepanel">
+
+                        <h2>Side Panel</h2>
+
+                        <mat-slide-toggle formControlName="hidden">
+                            Hide
+                        </mat-slide-toggle>
+
+                        <h3 class="mt-24">Position:</h3>
+                        <mat-radio-group fxLayout="column" fxLayoutAlign="start start" formControlName="position">
+                            <mat-radio-button class="mb-12" value="left">Left</mat-radio-button>
+                            <mat-radio-button class="mb-12" value="right">Right</mat-radio-button>
+                        </mat-radio-group>
+
+                    </div>
+
                 </ng-container>
 
                 <!-- VERTICAL LAYOUT #2 -->
@@ -226,6 +243,23 @@
 
                     </div>
 
+                    <!-- SIDE PANEL -->
+                    <div class="group" formGroupName="sidepanel">
+
+                        <h2>Side Panel</h2>
+
+                        <mat-slide-toggle formControlName="hidden">
+                            Hide
+                        </mat-slide-toggle>
+
+                        <h3 class="mt-24">Position:</h3>
+                        <mat-radio-group fxLayout="column" fxLayoutAlign="start start" formControlName="position">
+                            <mat-radio-button class="mb-12" value="left">Left</mat-radio-button>
+                            <mat-radio-button class="mb-12" value="right">Right</mat-radio-button>
+                        </mat-radio-group>
+
+                    </div>
+
                 </ng-container>
 
                 <!-- VERTICAL LAYOUT #3 -->
@@ -318,6 +352,23 @@
 
                     </div>
 
+                    <!-- SIDE PANEL -->
+                    <div class="group" formGroupName="sidepanel">
+
+                        <h2>Side Panel</h2>
+
+                        <mat-slide-toggle formControlName="hidden">
+                            Hide
+                        </mat-slide-toggle>
+
+                        <h3 class="mt-24">Position:</h3>
+                        <mat-radio-group fxLayout="column" fxLayoutAlign="start start" formControlName="position">
+                            <mat-radio-button class="mb-12" value="left">Left</mat-radio-button>
+                            <mat-radio-button class="mb-12" value="right">Right</mat-radio-button>
+                        </mat-radio-group>
+
+                    </div>
+
                 </ng-container>
 
                 <!-- HORIZONTAL LAYOUT #1 -->
@@ -405,6 +456,23 @@
 
                     </div>
 
+                    <!-- SIDE PANEL -->
+                    <div class="group" formGroupName="sidepanel">
+
+                        <h2>Side Panel</h2>
+
+                        <mat-slide-toggle formControlName="hidden">
+                            Hide
+                        </mat-slide-toggle>
+
+                        <h3 class="mt-24">Position:</h3>
+                        <mat-radio-group fxLayout="column" fxLayoutAlign="start start" formControlName="position">
+                            <mat-radio-button class="mb-12" value="left">Left</mat-radio-button>
+                            <mat-radio-button class="mb-12" value="right">Right</mat-radio-button>
+                        </mat-radio-group>
+
+                    </div>
+
                 </ng-container>
 
             </ng-container>
diff --git a/src/@fuse/components/theme-options/theme-options.component.ts b/src/@fuse/components/theme-options/theme-options.component.ts
index 2243e1ea..7facf8ce 100644
--- a/src/@fuse/components/theme-options/theme-options.component.ts
+++ b/src/@fuse/components/theme-options/theme-options.component.ts
@@ -62,24 +62,28 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
         // noinspection TypeScriptValidateTypes
         this.form = this._formBuilder.group({
             layout          : this._formBuilder.group({
-                style  : new FormControl(),
-                width  : new FormControl(),
-                navbar : this._formBuilder.group({
+                style    : new FormControl(),
+                width    : new FormControl(),
+                navbar   : this._formBuilder.group({
                     background: new FormControl(),
                     folded    : new FormControl(),
                     hidden    : new FormControl(),
                     position  : new FormControl(),
                     variant   : new FormControl()
                 }),
-                toolbar: this._formBuilder.group({
+                toolbar  : this._formBuilder.group({
                     background: new FormControl(),
                     hidden    : new FormControl(),
                     position  : new FormControl()
                 }),
-                footer : this._formBuilder.group({
+                footer   : this._formBuilder.group({
                     background: new FormControl(),
                     hidden    : new FormControl(),
                     position  : new FormControl()
+                }),
+                sidepanel: this._formBuilder.group({
+                    hidden: new FormControl(),
+                    position  : new FormControl()
                 })
             }),
             customScrollbars: new FormControl()
diff --git a/src/@fuse/types/fuse-config.ts b/src/@fuse/types/fuse-config.ts
index 6ad44ba4..1b513489 100644
--- a/src/@fuse/types/fuse-config.ts
+++ b/src/@fuse/types/fuse-config.ts
@@ -19,6 +19,10 @@ export interface FuseConfig
             background: string,
             hidden: boolean,
             position: 'above' | 'above-static' | 'above-fixed' | 'below' | 'below-static' | 'below-fixed'
+        },
+        sidepanel: {
+            hidden: boolean,
+            position: 'left' | 'right'
         }
     };
     customScrollbars: boolean;
diff --git a/src/app/app.component.html b/src/app/app.component.html
index b1bd2000..8e2890eb 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -20,6 +20,8 @@
 
 <!-- THEME OPTIONS PANEL -->
 <button mat-icon-button class="mat-primary-bg mat-elevation-z2 theme-options-button"
+        [ngClass]="{'right-side-panel': fuseConfig.layout.sidepanel.position === 'right',
+                    'side-panel-hidden': fuseConfig.layout.sidepanel.hidden === true}"
         (click)="toggleSidebarOpen('themeOptionsPanel')">
     <mat-icon>settings</mat-icon>
 </button>
diff --git a/src/app/fuse-config/index.ts b/src/app/fuse-config/index.ts
index aac07997..7db7b88c 100644
--- a/src/app/fuse-config/index.ts
+++ b/src/app/fuse-config/index.ts
@@ -10,24 +10,28 @@ import { FuseConfig } from '@fuse/types';
 
 export const fuseConfig: FuseConfig = {
     layout          : {
-        style  : 'vertical-layout-1',
-        width  : 'fullwidth',
-        navbar : {
+        style    : 'vertical-layout-1',
+        width    : 'fullwidth',
+        navbar   : {
             background: 'mat-fuse-dark-700-bg',
             folded    : false,
             hidden    : false,
             position  : 'left',
             variant   : 'vertical-style-1'
         },
-        toolbar: {
+        toolbar  : {
             background: 'mat-white-500-bg',
             hidden    : false,
             position  : 'below-static'
         },
-        footer : {
+        footer   : {
             background: 'mat-fuse-dark-900-bg',
             hidden    : false,
             position  : 'below-fixed'
+        },
+        sidepanel: {
+            hidden  : false,
+            position: 'right'
         }
     },
     customScrollbars: true
diff --git a/src/app/layout/horizontal/layout-1/layout-1.component.html b/src/app/layout/horizontal/layout-1/layout-1.component.html
index d04d06b0..e06ee6be 100644
--- a/src/app/layout/horizontal/layout-1/layout-1.component.html
+++ b/src/app/layout/horizontal/layout-1/layout-1.component.html
@@ -1,3 +1,17 @@
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'left'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="left" class="chat-panel left-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <div id="main" [ngClass]="{'boxed':fuseConfig.layout.width === 'boxed'}">
 
     <!-- TOOLBAR: Above -->
@@ -55,6 +69,20 @@
 
 </div>
 
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'right'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="right" class="chat-panel right-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <!-- QUICK PANEL -->
 <fuse-sidebar name="quickPanel" position="right" class="quick-panel">
     <quick-panel></quick-panel>
diff --git a/src/app/layout/vertical/layout-1/layout-1.component.html b/src/app/layout/vertical/layout-1/layout-1.component.html
index ba0f3165..942a5b2b 100644
--- a/src/app/layout/vertical/layout-1/layout-1.component.html
+++ b/src/app/layout/vertical/layout-1/layout-1.component.html
@@ -1,3 +1,17 @@
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'left'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="left" class="chat-panel left-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <div id="main" [ngClass]="{'boxed':fuseConfig.layout.width === 'boxed'}">
 
     <!-- TOOLBAR: Above -->
@@ -67,6 +81,20 @@
 
 </div>
 
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'right'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="right" class="chat-panel right-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <!-- QUICK PANEL -->
 <fuse-sidebar name="quickPanel" position="right" class="quick-panel">
     <quick-panel></quick-panel>
diff --git a/src/app/layout/vertical/layout-2/layout-2.component.html b/src/app/layout/vertical/layout-2/layout-2.component.html
index fc1fc66e..f4fd6dd1 100644
--- a/src/app/layout/vertical/layout-2/layout-2.component.html
+++ b/src/app/layout/vertical/layout-2/layout-2.component.html
@@ -1,3 +1,17 @@
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'left'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="left" class="chat-panel left-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <div id="main" [ngClass]="{'boxed':fuseConfig.layout.width === 'boxed'}">
 
     <!-- TOOLBAR: Above fixed -->
@@ -67,6 +81,20 @@
 
 </div>
 
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'right'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="right" class="chat-panel right-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <!-- QUICK PANEL -->
 <fuse-sidebar name="quickPanel" position="right" class="quick-panel">
     <quick-panel></quick-panel>
diff --git a/src/app/layout/vertical/layout-3/layout-3.component.html b/src/app/layout/vertical/layout-3/layout-3.component.html
index 82e159d4..9154e39d 100644
--- a/src/app/layout/vertical/layout-3/layout-3.component.html
+++ b/src/app/layout/vertical/layout-3/layout-3.component.html
@@ -1,3 +1,17 @@
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'left'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="left" class="chat-panel left-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <div id="main" [ngClass]="{'boxed':fuseConfig.layout.width === 'boxed'}">
 
     <!-- TOOLBAR: Above fixed -->
@@ -53,6 +67,20 @@
 
 </div>
 
+<!-- SIDE PANEL -->
+<ng-container *ngIf="!fuseConfig.layout.sidepanel.hidden && fuseConfig.layout.sidepanel.position === 'right'">
+
+    <!-- CHAT PANEL -->
+    <fuse-sidebar name="chatPanel" position="right" class="chat-panel right-chat-panel"
+                  [folded]="true" [foldedWidth]="70" [foldedAutoTriggerOnHover]="false"
+                  lockedOpen="gt-md">
+        <chat-panel></chat-panel>
+    </fuse-sidebar>
+    <!-- / CHAT PANEL -->
+
+</ng-container>
+<!-- / SIDE PANEL -->
+
 <!-- QUICK PANEL -->
 <fuse-sidebar name="quickPanel" position="right" class="quick-panel">
     <quick-panel></quick-panel>