diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.html b/docs/app/pages/home/main-info-section/main-info-section.component.html
index 426e0573..1ad0c887 100644
--- a/docs/app/pages/home/main-info-section/main-info-section.component.html
+++ b/docs/app/pages/home/main-info-section/main-info-section.component.html
@@ -42,5 +42,6 @@
     </div>
 
     <ngx-download-admin></ngx-download-admin>
+    <ngx-premium></ngx-premium>
   </div>
 </div>
diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.scss b/docs/app/pages/home/main-info-section/main-info-section.component.scss
index b428337a..a17d871a 100644
--- a/docs/app/pages/home/main-info-section/main-info-section.component.scss
+++ b/docs/app/pages/home/main-info-section/main-info-section.component.scss
@@ -11,7 +11,7 @@
   $color-active: nb-theme(color-active-fg);
 
   display: flex;
-  padding: 3.375rem 0 0;
+  padding: 3.375rem 0;
   max-width: 120rem;
   margin: 0 auto;
 
diff --git a/docs/app/shared/components/download-admin/download-admin.component.html b/docs/app/shared/components/download-admin/download-admin.component.html
index 48e03664..24fdaed4 100644
--- a/docs/app/shared/components/download-admin/download-admin.component.html
+++ b/docs/app/shared/components/download-admin/download-admin.component.html
@@ -1,3 +1,3 @@
-<button matRipple (click)="openDialog()" class="btn btn-download">
+<button (click)="openDialog()" class="btn btn-download">
   Download
 </button>
diff --git a/docs/app/shared/components/download-admin/download-admin.component.scss b/docs/app/shared/components/download-admin/download-admin.component.scss
index 75c0a5de..01d5f42f 100644
--- a/docs/app/shared/components/download-admin/download-admin.component.scss
+++ b/docs/app/shared/components/download-admin/download-admin.component.scss
@@ -9,6 +9,7 @@
 
 @include nb-install-component() {
   .btn {
+    display: block;
     font-family: nb-theme(font-main), sans-serif;
     border-radius: 3px;
     border: none;
diff --git a/docs/app/shared/components/download-form/download-form.component.html b/docs/app/shared/components/download-form/download-form.component.html
index 363b74c9..a14fcd59 100644
--- a/docs/app/shared/components/download-form/download-form.component.html
+++ b/docs/app/shared/components/download-form/download-form.component.html
@@ -1,8 +1,12 @@
 <nb-card>
-  <nb-card-body>
+  <nb-card-header>
+    <span>Download</span>
     <div class="close-icon" (click)="closeDialog()">
       <i [innerHTML]="'close' | eva: { width: 26, height: 26, fill: '#222b45' }"></i>
     </div>
+  </nb-card-header>
+  <nb-card-body>
+
     <div id="hubspotForm"></div>
   </nb-card-body>
 </nb-card>
diff --git a/docs/app/shared/components/download-form/download-form.component.scss b/docs/app/shared/components/download-form/download-form.component.scss
index 418c07a6..88940b53 100644
--- a/docs/app/shared/components/download-form/download-form.component.scss
+++ b/docs/app/shared/components/download-form/download-form.component.scss
@@ -9,15 +9,22 @@
 @import '../../../@theme/styles/themes';
 
 @include nb-install-component() {
-  nb-card-body {
-    position: relative;
+
+  nb-card {
+    width: 30rem;
+  }
+
+  nb-card-header {
+    display: flex;
+    align-items: center;
   }
 
   .close-icon {
     cursor: pointer;
-    position: absolute;
+    margin-left: auto;
     right: 0.1rem;
     top: 0.1rem;
+    width: fit-content;
   }
 
   ::ng-deep .custom-form {
@@ -56,6 +63,20 @@
       }
     }
 
+    .hs-richtext .modal-body {
+      padding: 0;
+      margin-bottom: 1rem;
+      p {
+        margin-bottom: 0;
+        text-align: left ! important;
+        height: auto;
+      }
+    }
+
+    .hs-recaptcha {
+      margin-top: 1rem;
+    }
+
     .hs-error-msgs {
       list-style-type: none;
       padding: 0;
diff --git a/docs/app/shared/components/premium-form/premium-form.component.html b/docs/app/shared/components/premium-form/premium-form.component.html
new file mode 100644
index 00000000..f20a9297
--- /dev/null
+++ b/docs/app/shared/components/premium-form/premium-form.component.html
@@ -0,0 +1,11 @@
+<nb-card>
+  <nb-card-header>
+    <span>Download</span>
+    <div class="close-icon" (click)="closeDialog()">
+      <i [innerHTML]="'close' | eva: { width: 26, height: 26, fill: '#222b45' }"></i>
+    </div>
+  </nb-card-header>
+  <nb-card-body>
+    <div id="hubspotForm"></div>
+  </nb-card-body>
+</nb-card>
diff --git a/docs/app/shared/components/premium-form/premium-form.component.scss b/docs/app/shared/components/premium-form/premium-form.component.scss
new file mode 100644
index 00000000..a34404bc
--- /dev/null
+++ b/docs/app/shared/components/premium-form/premium-form.component.scss
@@ -0,0 +1,113 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+@import '~@nebular/theme/styles/global/breakpoints';
+
+@import '../../../@theme/styles/themes';
+
+@include nb-install-component() {
+
+  nb-card {
+    width: 30rem;
+  }
+
+  nb-card-header {
+    display: flex;
+    align-items: center;
+  }
+
+  .close-icon {
+    cursor: pointer;
+    margin-left: auto;
+    right: 0.1rem;
+    top: 0.1rem;
+    width: fit-content;
+  }
+
+  ::ng-deep .custom-form {
+    .modal-header {
+      display: none;
+    }
+
+    .modal-body {
+      padding-bottom: 0;
+    }
+
+    .actions {
+      display: flex;
+      justify-content: flex-end;
+    }
+
+    input.hs-input {
+      width: 100%;
+      font-size: nb-theme(font-size-sm);
+      padding: 0.75rem 1rem !important;
+      border: 1px solid #e4e9f2;
+      box-shadow: nb-theme(shadow-default);
+      border-radius: 0.25rem;
+
+      &.invalid {
+        box-shadow: 0 0 1.25rem 0 rgba(210, 45, 45, 0.6);
+      }
+
+      &::placeholder {
+        color: #434a59;
+        opacity: 0.24;
+      }
+
+      &:focus {
+        outline: none;
+      }
+    }
+
+    .hs-richtext .modal-body {
+      padding: 0;
+      margin-bottom: 1rem;
+      p {
+        margin-bottom: 0;
+        text-align: left ! important;
+      }
+    }
+
+    .hs-recaptcha {
+      margin-top: 1rem;
+    }
+
+    .hs-error-msgs {
+      list-style-type: none;
+      padding: 0;
+    }
+
+    .hs-form-required, .hs-error-msg {
+      color: #f2545b;
+    }
+
+    .hs_error_rollup {
+      display: none;
+    }
+
+    .btn {
+      margin-top: 2rem;
+      font-family: nb-theme(font-main), sans-serif;
+      border-radius: 3px;
+      border: none;
+      background-color: nb-theme(color-active-fg);
+      color: #ffffff;
+      padding: 1rem 2rem;
+      box-shadow: nb-theme(shadow-btn);
+      cursor: pointer;
+      text-transform: uppercase;
+
+      &:hover {
+        box-shadow: nb-theme(shadow-hover-green-btn);
+      }
+
+      &:active {
+        box-shadow: nb-theme(shadow-active-green-btn);
+      }
+    }
+  }
+}
diff --git a/docs/app/shared/components/premium-form/premium-form.component.ts b/docs/app/shared/components/premium-form/premium-form.component.ts
new file mode 100644
index 00000000..d55058fd
--- /dev/null
+++ b/docs/app/shared/components/premium-form/premium-form.component.ts
@@ -0,0 +1,36 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+import { AfterViewInit, Component } from '@angular/core';
+import { NbDialogRef } from '@nebular/theme';
+
+@Component({
+  selector: 'ngx-premium-form',
+  templateUrl: './premium-form.component.html',
+  styleUrls: ['./premium-form.component.scss'],
+})
+export class PremiumFormComponent implements AfterViewInit {
+
+
+  constructor(protected ref: NbDialogRef<PremiumFormComponent>) {
+  }
+
+  ngAfterViewInit() {
+    hbspt.forms.create({
+      portalId: '2452262',
+      formId: 'b066428e-c41a-4dce-bbc2-5690cf084a8f',
+      target: '#hubspotForm',
+      submitButtonClass: 'btn',
+      css: '',
+      cssClass: 'custom-form',
+      redirectUrl: 'https://github.com/akveo/ngx-admin',
+    });
+  }
+
+  closeDialog() {
+    this.ref.close();
+  }
+}
diff --git a/docs/app/shared/components/premium/premium.component.html b/docs/app/shared/components/premium/premium.component.html
new file mode 100644
index 00000000..3d78bf20
--- /dev/null
+++ b/docs/app/shared/components/premium/premium.component.html
@@ -0,0 +1,3 @@
+<button (click)="openDialog()" class="btn btn-download">
+  Get ngx-admin PREMIUM for 89$
+</button>
diff --git a/docs/app/shared/components/premium/premium.component.scss b/docs/app/shared/components/premium/premium.component.scss
new file mode 100644
index 00000000..01d5f42f
--- /dev/null
+++ b/docs/app/shared/components/premium/premium.component.scss
@@ -0,0 +1,60 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+@import '../../../@theme/styles/themes';
+@import '~@nebular/theme/styles/global/breakpoints';
+
+@include nb-install-component() {
+  .btn {
+    display: block;
+    font-family: nb-theme(font-main), sans-serif;
+    border-radius: 3px;
+    border: none;
+    background: #ffffff;
+    color: #000000;
+    padding: 1.125rem 0;
+    box-shadow: nb-theme(shadow-default);
+    cursor: pointer;
+    text-transform: uppercase;
+
+    &.btn-download {
+      margin-left: 1em;
+      color: #ffffff;
+      background-color: nb-theme(color-active-fg);
+      box-shadow: nb-theme(shadow-btn);
+
+      &:hover {
+        box-shadow: nb-theme(shadow-hover-green-btn);
+      }
+
+      &:active {
+        box-shadow: nb-theme(shadow-active-green-btn);
+      }
+    }
+
+    &.btn-download {
+      margin-left: 0;
+      margin-top: 1rem;
+      width: 100%;
+    }
+
+    &:hover {
+      box-shadow: nb-theme(shadow-hover-btn);
+    }
+
+    &:active {
+      box-shadow: nb-theme(shadow-active-btn);
+    }
+  }
+
+  @include media-breakpoint-down(md) {
+    .btn {
+      font-size: 0.7rem;
+      padding-bottom: 1rem;
+      padding-top: 1rem;
+    }
+  }
+}
diff --git a/docs/app/shared/components/premium/premium.component.ts b/docs/app/shared/components/premium/premium.component.ts
new file mode 100644
index 00000000..66a6719a
--- /dev/null
+++ b/docs/app/shared/components/premium/premium.component.ts
@@ -0,0 +1,26 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+import { Component } from '@angular/core';
+import {NbDialogService} from '@nebular/theme';
+import {PremiumFormComponent} from '../premium-form/premium-form.component';
+
+@Component({
+  selector: 'ngx-premium',
+  templateUrl: './premium.component.html',
+  styleUrls: ['./premium.component.scss'],
+})
+export class PremiumComponent {
+
+
+  constructor(private dialogService: NbDialogService) {
+  }
+
+  openDialog() {
+    this.dialogService.open(PremiumFormComponent);
+  }
+
+}
diff --git a/docs/app/shared/landing-shared.module.ts b/docs/app/shared/landing-shared.module.ts
index d43b794b..fd1bbd91 100644
--- a/docs/app/shared/landing-shared.module.ts
+++ b/docs/app/shared/landing-shared.module.ts
@@ -6,11 +6,15 @@ import { EvaIconsPipe } from './pipes/eva-icons.pipe';
 import { RouterModule } from '@angular/router';
 import { DownloadAdminComponent } from './components/download-admin/download-admin.component';
 import { DownloadFormComponent } from './components/download-form/download-form.component';
+import { PremiumComponent } from './components/premium/premium.component';
+import { PremiumFormComponent } from './components/premium-form/premium-form.component';
 
 const component = [
   MaterialThemeLinkComponent,
   DownloadAdminComponent,
   DownloadFormComponent,
+  PremiumComponent,
+  PremiumFormComponent,
 ];
 const pipes = [
   CapitalizePipe,
@@ -31,6 +35,7 @@ const pipes = [
   ],
   entryComponents: [
     DownloadFormComponent,
+    PremiumFormComponent,
   ],
   exports: [
     NbPopoverModule,