diff --git a/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.style.scss b/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.style.scss
index f19870a138365f48ef47703f3604c1ee1e04e4b0..cc3249fac80760e354fd17db88b32a77cdc92c25 100644
--- a/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.style.scss
+++ b/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.style.scss
@@ -33,3 +33,12 @@ sxplr-smart-chip:not(:last-child)
     padding-left: 1rem;
   }
 }
+
+:host-context([experimental=true])
+sxplr-smart-chip:not(:last-child)
+{
+  .header
+  {
+    padding-left: 1rem;
+  }
+}
diff --git a/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.template.html b/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.template.html
index e661e5203e445cd9933b03a672cca0d400b4b2f9..f8ed4de44d6360bcd5b76090d5d914ba04d012c1 100644
--- a/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.template.html
+++ b/src/atlasComponents/sapiViews/core/rich/ATPSelector/pureDumb/pureATPSelector.template.html
@@ -10,7 +10,7 @@
     [disabled]="isBusy">
 
     <ng-template sxplrSmartChipHeader>
-      <span>
+      <span class="header">
         Parcellation
       </span>
 
@@ -61,7 +61,7 @@
     [disabled]="isBusy">
     
     <ng-template sxplrSmartChipHeader>
-      <span>
+      <span class="header">
         Template
       </span>
 
@@ -93,7 +93,7 @@
     quick-tour-description="You can change atlas here.">
 
     <ng-template sxplrSmartChipHeader>
-      <span>
+      <span class="header">
         Atlas
       </span>
 
diff --git a/src/components/smartChip/component/smartChip.style.scss b/src/components/smartChip/component/smartChip.style.scss
index ecd4832468dfe5d18a5b9337495a4388ee97d0d4..f6d54f0079aab5db18090676a8200bee03083390 100644
--- a/src/components/smartChip/component/smartChip.style.scss
+++ b/src/components/smartChip/component/smartChip.style.scss
@@ -6,6 +6,44 @@
   position: relative;
 }
 
+:host-context([experimental=true]) :host
+{
+  min-height: 44px;
+}
+
+:host-context([experimental=true]) .smart-chip
+{
+  display: inline-flex;
+  flex-direction: column!important;
+  border-radius: 22px;
+  align-items: center;
+  justify-content: start;
+}
+
+:host-context([experimental=true]) .header
+{
+  font-size: 80%;
+  margin-top:-0.5rem;
+  margin-bottom:0.3rem;
+  flex-basis: 1rem;
+}
+
+:host-context([experimental=true]) .body
+{
+  width: 100%;
+  flex: 1 1 0;
+  display: flex;
+  align-items: start;
+}
+:host-context([experimental=true]) .body>.body-content-wrapper
+{
+  height: 1px;
+  width: 100%;
+  overflow: visible;
+  display: flex;
+  align-items: center;
+}
+
 .smart-chip
 {
   box-sizing: border-box;
diff --git a/src/components/smartChip/component/smartChip.template.html b/src/components/smartChip/component/smartChip.template.html
index 96964d1be7e8432ca7929bfceda2efb9c1fdc1aa..659c02630e73bbfde5668378329fa026100b17a2 100644
--- a/src/components/smartChip/component/smartChip.template.html
+++ b/src/components/smartChip/component/smartChip.template.html
@@ -1,3 +1,42 @@
+<ng-template [ngIf]="experimental.show$ | async"
+  let-tmpl
+  sxplrExperimentalFlag
+  [experimental]="true"
+  #experimental="sxplrExperimentalFlag">
+
+<div [style.background-color]="color"
+  [matMenuTriggerFor]="noMenuFlag ? null : mainMenu"
+  matRipple
+  [matRippleDisabled]="noMenuFlag"
+  [ngClass]="smartChipClass"
+  class="mat-body smart-chip body sxplr-custom-cmp text">
+
+  <!-- header component -->
+
+  <ng-template [ngIf]="headerTmpl?.templateRef" let-tmpl>
+    <div class="mat-body sxplr-custom-cmp text header">
+      <ng-template [ngTemplateOutlet]="tmpl">
+      </ng-template>
+    </div>
+  </ng-template>
+  <div class="body">
+    <div class="body-content-wrapper">
+      <ng-template [ngTemplateOutlet]="contentTmpl?.templateRef || fallbackContentTmpl">
+      </ng-template>
+    </div>
+  </div>
+</div>
+
+
+</ng-template>
+
+
+
+<ng-template [ngIf]="deprecated.show$ | async"
+
+  sxplrExperimentalFlag
+  [deprecated]="true"
+  #deprecated="sxplrExperimentalFlag">
 
 <div [style.background-color]="color"
   [matMenuTriggerFor]="noMenuFlag ? null : mainMenu"
@@ -21,6 +60,9 @@
   </div>
 </ng-template>
 
+</ng-template>
+
+
 <!-- main menu is fired from chip -->
 <mat-menu #mainMenu="matMenu">
   <ng-template ngFor [ngForOf]="items" let-item>
diff --git a/src/components/smartChip/module.ts b/src/components/smartChip/module.ts
index 78c85f3a44beedae96ec1562b0e36c3941768f10..e5c9616adcf1a4b4d4a9e4a2f5eba573a00d743d 100644
--- a/src/components/smartChip/module.ts
+++ b/src/components/smartChip/module.ts
@@ -8,6 +8,7 @@ import { HasSubMenuPipe } from "./hasSubmenu.pipe";
 import { SmartChipContent } from "./smartChip.content.directive";
 import { SmartChipHeader } from "./smartChip.header.directive";
 import { SmartChipMenu } from "./smartChip.menu.directive";
+import { ExperimentalModule } from "src/experimental/experimental.module";
 
 @NgModule({
   imports: [
@@ -15,6 +16,7 @@ import { SmartChipMenu } from "./smartChip.menu.directive";
     MatMenuModule,
     BrowserAnimationsModule,
     MatRippleModule,
+    ExperimentalModule,
   ],
   declarations: [
     SmartChipMenu,
diff --git a/src/viewerModule/module.ts b/src/viewerModule/module.ts
index da2c56f121e5448e0dea34081de8520d150cb40b..63e872a851a46c7bd18c0e22b303e469b7dc82f0 100644
--- a/src/viewerModule/module.ts
+++ b/src/viewerModule/module.ts
@@ -34,6 +34,7 @@ import { FeatureModule } from "src/features";
 import { NgLayerCtlModule } from "./nehuba/ngLayerCtlModule/module";
 import { SmartChipModule } from "src/components/smartChip";
 import { ReactiveFormsModule } from "@angular/forms";
+import { ExperimentalModule } from "src/experimental/experimental.module";
 
 @NgModule({
   imports: [
@@ -60,6 +61,7 @@ import { ReactiveFormsModule } from "@angular/forms";
     NgLayerCtlModule,
     SmartChipModule,
     ReactiveFormsModule,
+    ExperimentalModule,
     ...(environment.ENABLE_LEAP_MOTION ? [LeapModule] : [])
   ],
   declarations: [
diff --git a/src/viewerModule/viewerCmp/viewerCmp.template.html b/src/viewerModule/viewerCmp/viewerCmp.template.html
index 459fb19e841d22944af9cf5a8bca36512bcb6d0c..89dc6c8fae7b07328e8c20366b53467cc0ba657d 100644
--- a/src/viewerModule/viewerCmp/viewerCmp.template.html
+++ b/src/viewerModule/viewerCmp/viewerCmp.template.html
@@ -439,6 +439,17 @@
             [sxplr-sapiviews-core-region-region]="region"
             [sxplr-sapiviews-core-region-detail-flag]="true"
             #sapiViewsCoreRegion="sapiViewsCoreRegion">
+            
+            <ng-template sxplrSmartChipHeader
+              [ngIf]="experimental.show$ | async"
+              sxplrExperimentalFlag
+              [experimental]="true"
+              #experimental="sxplrExperimentalFlag">
+              <span class="regionname">
+                Region
+              </span>
+            </ng-template>
+            
             <ng-template sxplrSmartChipContent>
               <span class="regionname">
                 {{ region.name }}