diff --git a/apps/common/main/lib/controller/ExternalDiagramEditor.js b/apps/common/main/lib/controller/ExternalDiagramEditor.js
index a7d4924dfd..19e3cb5cd2 100644
--- a/apps/common/main/lib/controller/ExternalDiagramEditor.js
+++ b/apps/common/main/lib/controller/ExternalDiagramEditor.js
@@ -99,6 +99,11 @@ define([
                         'resize': _.bind(function(o, state){
                             externalEditor && externalEditor.serviceCommand('window:resize', state == 'start');
                         },this),
+                        'animate:before': _.bind(function(){
+                            if(!this.isAppFirstOpened) {
+                                externalEditor && externalEditor.serviceCommand('reshow');
+                            }
+                        },this),
                         'show': _.bind(function(cmp){
                             var h = this.diagramEditorView.getHeight(),
                                 innerHeight = Common.Utils.innerHeight() - Common.Utils.InternalSettings.get('window-inactive-area-top');
diff --git a/apps/common/main/lib/controller/ExternalMergeEditor.js b/apps/common/main/lib/controller/ExternalMergeEditor.js
index ed06c2abd9..f086e7a120 100644
--- a/apps/common/main/lib/controller/ExternalMergeEditor.js
+++ b/apps/common/main/lib/controller/ExternalMergeEditor.js
@@ -98,6 +98,11 @@ define([
                         'resize': _.bind(function(o, state){
                             externalEditor && externalEditor.serviceCommand('window:resize', state == 'start');
                         },this),
+                        'animate:before': _.bind(function(){
+                            if(!this.isAppFirstOpened) {
+                                externalEditor && externalEditor.serviceCommand('reshow');
+                            }
+                        },this),
                         'show': _.bind(function(cmp){
                             var h = this.mergeEditorView.getHeight(),
                                 innerHeight = Common.Utils.innerHeight();
diff --git a/apps/common/main/lib/controller/ExternalOleEditor.js b/apps/common/main/lib/controller/ExternalOleEditor.js
index 69a101e595..7fc96badf0 100644
--- a/apps/common/main/lib/controller/ExternalOleEditor.js
+++ b/apps/common/main/lib/controller/ExternalOleEditor.js
@@ -99,6 +99,11 @@ define([
                         'resize': _.bind(function(o, state){
                             externalEditor && externalEditor.serviceCommand('window:resize', state == 'start');
                         },this),
+                        'animate:before': _.bind(function(){
+                            if(!this.isAppFirstOpened) {
+                                externalEditor && externalEditor.serviceCommand('reshow');
+                            }
+                        },this),
                         'show': _.bind(function(cmp){
                             var h = this.oleEditorView.getHeight(),
                                 innerHeight = Common.Utils.innerHeight() - Common.Utils.InternalSettings.get('window-inactive-area-top');
diff --git a/apps/common/main/lib/controller/Themes.js b/apps/common/main/lib/controller/Themes.js
index 5c3dcb034c..905db6ae2c 100644
--- a/apps/common/main/lib/controller/Themes.js
+++ b/apps/common/main/lib/controller/Themes.js
@@ -68,6 +68,9 @@ define([
                                     --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px;
                                     --sk-canvas-background: #eee; --sk-canvas-content-background: #fff;
                                     --sk-canvas-page-border: #dde0e5; --sk-canvas-line: rgba(0,0,0,.05);
+                                    --sk-height-formula: 24px; --sk-padding-formula: 0 0 4px 0;
+                                    --sk-border-style-formula: solid; --sk-gap-formula-field: 20px;
+                                    --sk-border-radius-formula-field: 0px;
                                 }`
                 },
             },
@@ -86,6 +89,9 @@ define([
                                     --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px;
                                     --sk-canvas-background: #eee; --sk-canvas-content-background: #fff;
                                     --sk-canvas-page-border: #dde0e5; --sk-canvas-line: rgba(0,0,0,.05);
+                                    --sk-height-formula: 24px; --sk-padding-formula: 0 0 4px 0;
+                                    --sk-border-style-formula: solid; --sk-gap-formula-field: 20px;
+                                    --sk-border-radius-formula-field: 0px;
                                 }`
                 },
             },
@@ -105,6 +111,9 @@ define([
                                 --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px;
                                 --sk-canvas-background: #555; --sk-canvas-content-background: #fff;
                                 --sk-canvas-page-border: #555; --sk-canvas-line: rgba(0,0,0,.05);
+                                --sk-height-formula: 24px; --sk-padding-formula: 0 0 4px 0;
+                                --sk-border-style-formula: solid; --sk-gap-formula-field: 20px;
+                                --sk-border-radius-formula-field: 0px;
                             }
                             .content-theme-dark {
                                 --sk-canvas-content-background: #3a3a3a; --sk-canvas-page-border: #616161;
@@ -128,6 +137,9 @@ define([
                                 --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px;
                                 --sk-canvas-background: #555; --sk-canvas-content-background: #fff;
                                 --sk-canvas-page-border: #555; --sk-canvas-line: rgba(0,0,0,.05);
+                                --sk-height-formula: 24px; --sk-padding-formula: 0 0 4px 0;
+                                --sk-border-style-formula: solid; --sk-gap-formula-field: 20px;
+                                --sk-border-radius-formula-field: 0px;
                             }
                             .content-theme-dark {
                                 --sk-canvas-content-background: #3a3a3a;
@@ -150,6 +162,9 @@ define([
                                     --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px;
                                     --sk-canvas-background: #eee; --sk-canvas-content-background: #fff;
                                     --sk-canvas-page-border: #ccc; --sk-canvas-line: rgba(0,0,0,.05);
+                                    --sk-height-formula: 24px; --sk-padding-formula: 0 0 4px 0;
+                                    --sk-border-style-formula: solid; --sk-gap-formula-field: 20px;
+                                    --sk-border-radius-formula-field: 0px;
                                 }`
                 },
             },
diff --git a/apps/common/main/resources/less/colors-table-classic.less b/apps/common/main/resources/less/colors-table-classic.less
index 0b559ad196..e703a77257 100644
--- a/apps/common/main/resources/less/colors-table-classic.less
+++ b/apps/common/main/resources/less/colors-table-classic.less
@@ -204,6 +204,8 @@
         --border-toolbar-z-clear: var(--border-toolbar);
         --shadow-toolbar: 0px 1px 0 0 var(--border-toolbar);
 
+        --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+
         --background-fill-input: var(--background-normal);
         --background-fill-input-disabled: var(--background-normal);
         --background-fill-input-readonly: var(--background-normal);
@@ -227,6 +229,7 @@
         --shadow-control-pressed-focus: inset 0 0 0 1px var(--background-normal), 0 0 0 1px var(--border-button-pressed-focus);
         --shadow-control-primary-pressed-focus: inset 0 0 0 1px var(--background-normal);
 
+        --toolbar-simple-border-bottom: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
         --toolbar-preferred-tab-style: fill;
 
         //--rb-background-normal: var(--background-normal);
diff --git a/apps/common/main/resources/less/colors-table-dark-contrast.less b/apps/common/main/resources/less/colors-table-dark-contrast.less
index 247e2177fd..feb88f8e08 100644
--- a/apps/common/main/resources/less/colors-table-dark-contrast.less
+++ b/apps/common/main/resources/less/colors-table-dark-contrast.less
@@ -205,6 +205,8 @@
         --border-toolbar-z-clear: var(--border-toolbar);
         --shadow-toolbar: 0px 1px 0 0 var(--border-toolbar);
 
+        --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+
         --background-fill-input: var(--background-normal);
         --background-fill-input-disabled: var(--background-normal);
         --background-fill-input-readonly: var(--background-normal);
@@ -228,6 +230,7 @@
         --shadow-control-pressed-focus: inset 0 0 0 1px var(--background-normal), 0 0 0 1px var(--border-button-pressed-focus);
         --shadow-control-primary-pressed-focus: inset 0 0 0 1px var(--background-normal);
 
+        --toolbar-simple-border-bottom: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
         --toolbar-preferred-tab-style: fill;
 
         //--rb-background-normal: var(--background-normal);
diff --git a/apps/common/main/resources/less/colors-table-dark.less b/apps/common/main/resources/less/colors-table-dark.less
index f7760ca54d..60205daead 100644
--- a/apps/common/main/resources/less/colors-table-dark.less
+++ b/apps/common/main/resources/less/colors-table-dark.less
@@ -206,6 +206,8 @@
         --border-toolbar-z-clear: var(--border-toolbar);
         --shadow-toolbar: 0px 1px 0 0 var(--border-toolbar);
 
+        --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+
         --background-fill-input: var(--background-normal);
         --background-fill-input-disabled: var(--background-normal);
         --background-fill-input-readonly: var(--background-normal);
@@ -229,6 +231,7 @@
         --shadow-control-pressed-focus: inset 0 0 0 1px var(--background-normal), 0 0 0 1px var(--border-button-pressed-focus);
         --shadow-control-primary-pressed-focus: inset 0 0 0 1px var(--background-normal);
 
+        --toolbar-simple-border-bottom: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
         --toolbar-preferred-tab-style: fill;
 
         //--rb-background-normal: var(--background-normal);
diff --git a/apps/common/main/resources/less/colors-table-gray.less b/apps/common/main/resources/less/colors-table-gray.less
index c2400812b1..b0b799a4fd 100644
--- a/apps/common/main/resources/less/colors-table-gray.less
+++ b/apps/common/main/resources/less/colors-table-gray.less
@@ -184,6 +184,8 @@
         --border-toolbar-z-clear: var(--border-toolbar);
         --shadow-toolbar: 0px 1px 0 0 var(--border-toolbar);
 
+        --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+
         --background-fill-input: var(--background-normal);
         --background-fill-input-disabled: var(--background-normal);
         --background-fill-input-readonly: var(--background-normal);
@@ -207,6 +209,7 @@
         --shadow-control-pressed-focus: inset 0 0 0 1px var(--background-normal), 0 0 0 1px var(--border-button-pressed-focus);
         --shadow-control-primary-pressed-focus: inset 0 0 0 1px var(--background-normal);
 
+        --toolbar-simple-border-bottom: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
         --toolbar-preferred-tab-style: fill;
 
         //--rb-background-normal: var(--background-normal);
diff --git a/apps/common/main/resources/less/colors-table-ie-fix.less b/apps/common/main/resources/less/colors-table-ie-fix.less
index 7a32d23522..5c28a14ff4 100644
--- a/apps/common/main/resources/less/colors-table-ie-fix.less
+++ b/apps/common/main/resources/less/colors-table-ie-fix.less
@@ -93,6 +93,18 @@
 
 @component-disabled-opacity-ie: .4;
 
+// cell editor SSE
+@celleditor-height-ie: 24px;
+@celleditor-line-height-ie: 20px;
+@celleditor-border-width-ie: 0px;
+@celleditor-input-border-ie: 1px solid #E1E1E1;
+@celleditor-input-border-radius-ie: 4px;
+@celleditor-cell-name-border-right-ie: 1px solid #E1E1E1; 
+@celleditor-func-label-margin-left-ie: 1px;
+
+
+@x-small-btn-size-ie: 24px;
+
 .ie {
     .toolbar__icon.toolbar__icon-big {
         @big-icon-background-image-ie: ~"url(@{app-image-const-path}/iconsbig.png)";
diff --git a/apps/common/main/resources/less/colors-table-white.less b/apps/common/main/resources/less/colors-table-white.less
index 2524ab4e29..19755f157b 100644
--- a/apps/common/main/resources/less/colors-table-white.less
+++ b/apps/common/main/resources/less/colors-table-white.less
@@ -201,6 +201,10 @@
         --celleditor-height: 24px;
         --celleditor-line-height: 20px;
         --celleditor-border-width: 0px;
+        --celleditor-input-border: var(--scaled-one-pixel, 1px) solid var(--border-fill-input);
+        --celleditor-input-border-radius: var(--border-radius-form-control);
+        --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-fill-input);
+        --celleditor-func-label-margin-left: 1px;
 
         --x-small-btn-size: 24px;
         --x-small-btn-icon-size: 24px;
diff --git a/apps/common/main/resources/less/colors-table.less b/apps/common/main/resources/less/colors-table.less
index 37002a615c..2809e1ed67 100644
--- a/apps/common/main/resources/less/colors-table.less
+++ b/apps/common/main/resources/less/colors-table.less
@@ -257,6 +257,10 @@
     --celleditor-height: 20px;
     --celleditor-line-height: 18px;
     --celleditor-border-width: var(--scaled-one-pixel, 1px);
+    --celleditor-input-border: 0 none;
+    --celleditor-input-border-radius: 0;
+    --celleditor-cell-name-border-right: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+    --celleditor-func-label-margin-left: -3px;
 
     --x-small-btn-size: 20px;
     --x-small-btn-icon-size: 20px;
@@ -512,6 +516,10 @@
 @celleditor-height: var(--celleditor-height);
 @celleditor-line-height: var(--celleditor-line-height);
 @celleditor-border-width: var(--celleditor-border-width);
+@celleditor-input-border: var(--celleditor-input-border);
+@celleditor-input-border-radius: var(--celleditor-input-border-radius);
+@celleditor-cell-name-border-right: var(--celleditor-cell-name-border-right); 
+@celleditor-func-label-margin-left: var(--celleditor-func-label-margin-left);
 
 @x-small-btn-size: var(--x-small-btn-size, 20px);
 @x-small-btn-icon-size: var(--x-small-btn-icon-size, 20px);
diff --git a/apps/spreadsheeteditor/main/app/controller/CellEditor.js b/apps/spreadsheeteditor/main/app/controller/CellEditor.js
index eb70d58951..0a27c8e17a 100644
--- a/apps/spreadsheeteditor/main/app/controller/CellEditor.js
+++ b/apps/spreadsheeteditor/main/app/controller/CellEditor.js
@@ -73,6 +73,7 @@ define([
                     }.bind(this)
                 }
             });
+            Common.NotificationCenter.on('external:reshow', this.onExternalReshow.bind(this));
             Common.NotificationCenter.on('uitheme:changed', this.onThemeChanged.bind(this));
         },
 
@@ -261,7 +262,15 @@ define([
             Common.NotificationCenter.trigger('edit:complete', this.editor, {restorefocus:true});
         },
 
+        onExternalReshow: function () {
+            this.changeCellEditorHeight();
+        },
+
         onThemeChanged: function () {
+            this.changeCellEditorHeight();
+        },
+
+        changeCellEditorHeight: function() {
             if (!Common.localStorage.getBool('sse-celleditor-expand')) {
                 var editorMinHeight = parseFloat(this.editor.$el.css('min-height')) || 20;
                 editorMinHeight -= (parseFloat(this.editor.$el.css('border-bottom-width')) || 0);
diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js
index 3d520e2413..d64b513da3 100644
--- a/apps/spreadsheeteditor/main/app/controller/Main.js
+++ b/apps/spreadsheeteditor/main/app/controller/Main.js
@@ -2985,6 +2985,9 @@ define([
                         }
                         this.isAppDisabled = data.data;
                         break;
+                    case 'reshow': 
+                        Common.NotificationCenter.trigger('external:reshow');
+                        break;
                     case 'queryClose':
                         if (!Common.Utils.ModalWindow.isVisible()) {
                             this.isFrameClosed = true;
diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html
index dad2bf9d00..9d0cb43ee3 100644
--- a/apps/spreadsheeteditor/main/index.html
+++ b/apps/spreadsheeteditor/main/index.html
@@ -24,6 +24,11 @@
             --sk-canvas-content-background: #fff;
             --sk-canvas-page-border: #dde0e5;
             --sk-canvas-line: rgba(0,0,0,.05);
+            --sk-height-formula: 38px;
+            --sk-padding-formula: 10px 10px 4px 10px;
+            --sk-border-style-formula: none;
+            --sk-gap-formula-field: 28px;
+            --sk-border-radius-formula-field: 3px;
         }
 
         /* .theme-dark, .theme-type-dark {
@@ -160,7 +165,8 @@
             top: 0;
             bottom: 0;
             left: 875px;
-            width: 690px;
+            width: inherit;
+            max-width: 690px;
             height: 45px;
         }
         .rtl .loadmask > .sktoolbar li.fat {
@@ -169,9 +175,13 @@
         }
 
         .loadmask > .skformula {
+            padding: 0 0 4px 0;
+            padding: var(--sk-padding-formula);
             height: 24px;
-            background: #f1f1f1;
-            background: var(--background-toolbar, #f1f1f1);
+            height: var(--sk-height-formula);
+            background: #f7f7f7;
+            background-color: var(--sk-background-toolbar, #f7f7f7);
+            box-sizing: border-box;
         }
 
         .loadmask > .skformula ul {
@@ -179,30 +189,51 @@
             font-size: 0;
             box-sizing: border-box;
             border-style: solid;
+            border-style: var(--sk-border-style-formula);
             border-width: 1px;
             border-width: var(--scaled-one-px-value, 1px);
             border-color: #cbcbcb transparent;
             border-color: var(--border-toolbar, #cbcbcb) transparent;
+            border-top: 0 none;
+            display: flex;
+            height: 100%;
         }
 
         .loadmask > .skformula li {
             display: inline-block;
             box-sizing: border-box;
-            height: 19px;
-            width: 100%;
-            margin-left: 20px;
             background: #fff;
             background: var(--background-normal, #fff);
-            border-style: solid;
-            border-width: 1px;
-            border-width: var(--scaled-one-px-value, 1px);
-            border-color: transparent #cbcbcb;
-            border-color: transparent var(--border-toolbar, #cbcbcb);
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+            border-radius: 0px;
+            border-radius: var(--sk-border-radius-formula-field, 0px);
+            flex-grow: 1;
         }
 
         .loadmask > .skformula li:first-child {
             width: 100px;
-            margin-left: 0;
+            flex-grow: 0;
+            margin-right: 20px;
+            margin-right: var(--sk-gap-formula-field);
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li {
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li:first-child {
+            margin-right: 0;
+            margin-left: 20px;
+            margin-left: var(--sk-gap-formula-field);
+            border-right: 0 none; 
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
         }
 
         .loadmask > .placeholder {
diff --git a/apps/spreadsheeteditor/main/index.html.deploy b/apps/spreadsheeteditor/main/index.html.deploy
index 281527058d..2d5a5e60d8 100644
--- a/apps/spreadsheeteditor/main/index.html.deploy
+++ b/apps/spreadsheeteditor/main/index.html.deploy
@@ -27,6 +27,11 @@
             --sk-canvas-content-background: #fff;
             --sk-canvas-page-border: #dde0e5;
             --sk-canvas-line: rgba(0,0,0,.05);
+            --sk-height-formula: 38px;
+            --sk-padding-formula: 10px 10px 4px 10px;
+            --sk-border-style-formula: none;
+            --sk-gap-formula-field: 28px;
+            --sk-border-radius-formula-field: 3px;
         }
 
         .loadmask {
@@ -135,7 +140,8 @@
             top: 0;
             bottom: 0;
             left: 875px;
-            width: 690px;
+            width: inherit;
+            max-width: 690px;
             height: 45px;
         }
         .rtl .loadmask > .sktoolbar li.fat {
@@ -144,9 +150,13 @@
         }
 
         .loadmask>.skformula {
+            padding: 0 0 4px 0;
+            padding: var(--sk-padding-formula);
             height: 24px;
-            background: #f1f1f1;
-            background: var(--background-toolbar, #f1f1f1);
+            height: var(--sk-height-formula);
+            background: #f7f7f7;
+            background-color: var(--sk-background-toolbar, #f7f7f7);
+            box-sizing: border-box;
         }
 
         .loadmask>.skformula ul {
@@ -154,30 +164,51 @@
             font-size: 0;
             box-sizing: border-box;
             border-style: solid;
+            border-style: var(--sk-border-style-formula);
             border-width: 1px;
             border-width: var(--scaled-one-px-value, 1px);
             border-color: #cbcbcb transparent;
             border-color: var(--border-toolbar, #cbcbcb) transparent;
+            border-top: 0 none;
+            display: flex;
+            height: 100%;
         }
 
         .loadmask>.skformula li {
             display: inline-block;
             box-sizing: border-box;
-            height: 19px;
-            width: 100%;
-            margin-left: 20px;
             background: #fff;
             background: var(--background-normal, #fff);
-            border-style: solid;
-            border-width: 1px;
-            border-width: var(--scaled-one-px-value, 1px);
-            border-color: #cbcbcb;
-            border-color: transparent var(--border-toolbar, #cbcbcb);
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+            border-radius: 0px;
+            border-radius: var(--sk-border-radius-formula-field, 0px);
+            flex-grow: 1;
         }
 
         .loadmask>.skformula li:first-child {
             width: 100px;
-            margin-left: 0;
+            flex-grow: 0;
+            margin-right: 20px;
+            margin-right: var(--sk-gap-formula-field);
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li {
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li:first-child {
+            margin-right: 0;
+            margin-left: 20px;
+            margin-left: var(--sk-gap-formula-field);
+            border-right: 0 none; 
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
         }
 
         .loadmask > .placeholder {
diff --git a/apps/spreadsheeteditor/main/index_internal.html b/apps/spreadsheeteditor/main/index_internal.html
index 251fa33a83..f28959a3b5 100644
--- a/apps/spreadsheeteditor/main/index_internal.html
+++ b/apps/spreadsheeteditor/main/index_internal.html
@@ -17,6 +17,14 @@
             --canvas-page-border: #555;
         }
 
+        .loadmask {
+            --sk-height-formula: 32px;
+            --sk-padding-formula: 4px 10px;
+            --sk-border-style-formula: none;
+            --sk-gap-formula-field: 28px;
+            --sk-border-radius-formula-field: 3px;
+        }
+
         .loadmask {
             left: 0;
             top: 0;
@@ -38,9 +46,13 @@
         }
 
         .loadmask > .skformula {
+            padding: 0 0 4px 0;
+            padding: var(--sk-padding-formula);
             height: 24px;
+            height: var(--sk-height-formula);
             background: #f7f7f7;
-            background: var(--background-toolbar, #f7f7f7);
+            background-color: var(--sk-background-toolbar, #f7f7f7);
+            box-sizing: border-box;
         }
 
         .loadmask > .skformula ul {
@@ -48,30 +60,51 @@
             font-size: 0;
             box-sizing: border-box;
             border-style: solid;
+            border-style: var(--sk-border-style-formula);
             border-width: 1px;
             border-width: var(--scaled-one-px-value, 1px);
             border-color: #cbcbcb transparent;
             border-color: var(--border-toolbar, #cbcbcb) transparent;
+            border-top: 0 none;
+            display: flex;
+            height: 100%;
         }
 
         .loadmask > .skformula li {
             display: inline-block;
             box-sizing: border-box;
-            height: 19px;
-            width: 100%;
-            margin-left: 20px;
             background: #fff;
             background: var(--background-normal, #fff);
-            border-style: solid;
-            border-width: 1px;
-            border-width: var(--scaled-one-px-value, 1px);
-            border-color: transparent #cbcbcb;
-            border-color: transparent var(--border-toolbar, #cbcbcb);
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+            border-radius: 0px;
+            border-radius: var(--sk-border-radius-formula-field, 0px);
+            flex-grow: 1;
         }
 
         .loadmask > .skformula li:first-child {
             width: 100px;
-            margin-left: 0;
+            flex-grow: 0;
+            margin-right: 20px;
+            margin-right: var(--sk-gap-formula-field);
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li {
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li:first-child {
+            margin-right: 0;
+            margin-left: 20px;
+            margin-left: var(--sk-gap-formula-field);
+            border-right: 0 none; 
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
         }
 
         .loadmask > .placeholder {
diff --git a/apps/spreadsheeteditor/main/index_internal.html.deploy b/apps/spreadsheeteditor/main/index_internal.html.deploy
index 5b816a8824..aef1d85a7c 100644
--- a/apps/spreadsheeteditor/main/index_internal.html.deploy
+++ b/apps/spreadsheeteditor/main/index_internal.html.deploy
@@ -11,6 +11,14 @@
 
     <!-- splash -->
     <style type="text/css">
+        .loadmask {
+            --sk-height-formula: 32px;
+            --sk-padding-formula: 4px 10px;
+            --sk-border-style-formula: none;
+            --sk-gap-formula-field: 28px;
+            --sk-border-radius-formula-field: 3px;
+        }
+
         .loadmask {
             left: 0;
             top: 0;
@@ -32,9 +40,13 @@
         }
 
         .loadmask>.skformula {
+            padding: 0 0 4px 0;
+            padding: var(--sk-padding-formula);
             height: 24px;
+            height: var(--sk-height-formula);
             background: #f7f7f7;
-            background: var(--background-toolbar, #f7f7f7);
+            background-color: var(--sk-background-toolbar, #f7f7f7);
+            box-sizing: border-box;
         }
 
         .loadmask>.skformula ul {
@@ -42,30 +54,51 @@
             font-size: 0;
             box-sizing: border-box;
             border-style: solid;
+            border-style: var(--sk-border-style-formula);
             border-width: 1px;
             border-width: var(--scaled-one-px-value, 1px);
             border-color: #cbcbcb transparent;
             border-color: var(--border-toolbar, #cbcbcb) transparent;
+            border-top: 0 none;
+            display: flex;
+            height: 100%;
         }
 
         .loadmask>.skformula li {
             display: inline-block;
             box-sizing: border-box;
-            height: 19px;
-            width: 100%;
-            margin-left: 20px;
             background: #fff;
             background: var(--background-normal, #fff);
-            border-style: solid;
-            border-width: 1px;
-            border-width: var(--scaled-one-px-value, 1px);
-            border-color: #cbcbcb;
-            border-color: transparent var(--border-toolbar, #cbcbcb);
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+            border-radius: 0px;
+            border-radius: var(--sk-border-radius-formula-field, 0px);
+            flex-grow: 1;
         }
 
-        .loadmask>.skformula li:first-child {
+        .loadmask > .skformula li:first-child {
             width: 100px;
-            margin-left: 0;
+            flex-grow: 0;
+            margin-right: 20px;
+            margin-right: var(--sk-gap-formula-field);
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li {
+            border-left: 0 none; 
+            border-right: 1px solid #cbcbcb; 
+            border-right: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
+        }
+
+        .rtl .loadmask > .skformula li:first-child {
+            margin-right: 0;
+            margin-left: 20px;
+            margin-left: var(--sk-gap-formula-field);
+            border-right: 0 none; 
+            border-left: 1px solid #cbcbcb; 
+            border-left: var(--scaled-one-px-value, 1px) var(--sk-border-style-formula) var(--border-toolbar, #cbcbcb); 
         }
 
         .loadmask > .placeholder {
diff --git a/apps/spreadsheeteditor/main/resources/less/celleditor.less b/apps/spreadsheeteditor/main/resources/less/celleditor.less
index e2cca1eebf..143771fc1c 100644
--- a/apps/spreadsheeteditor/main/resources/less/celleditor.less
+++ b/apps/spreadsheeteditor/main/resources/less/celleditor.less
@@ -1,13 +1,15 @@
 #cell-editing-box {
-    border-bottom: solid @celleditor-border-width @border-toolbar-ie;
+    border-bottom: solid @celleditor-border-width-ie @border-toolbar-ie;
     border-bottom: solid @celleditor-border-width @border-toolbar;
-    border-left: solid @celleditor-border-width @border-toolbar-ie;
+    border-left: solid @celleditor-border-width-ie @border-toolbar-ie;
     border-left: solid @celleditor-border-width @border-toolbar;
+    min-height: @celleditor-height-ie;
     min-height: @celleditor-height;
     background-color: @background-pane-ie;
     background-color: @background-pane;
 
     .ce-group-name {
+        height: @celleditor-height-ie;
         height: @celleditor-height;
         //border-bottom: @scaled-one-px-value-ie solid @border-toolbar-ie;
         //border-bottom: @scaled-one-px-value solid @border-toolbar;
@@ -16,30 +18,28 @@
 
         #ce-cell-name {
             width: 100px;
-            height: calc(@celleditor-height - @celleditor-border-width);
-            height: calc(@celleditor-height - @celleditor-border-width + (1px - 1px/var(--pixel-ratio-factor,1)));
+            height: calc(@celleditor-height-ie - @celleditor-border-width-ie);
+            height: calc(@celleditor-height - var(--celleditor-border-width) + (1px - 1px/var(--pixel-ratio-factor,1)));
             padding: 0px 19px 0 4px;
             vertical-align: top;
             display: inline-block;
             transition: none;
             -webkit-transition: none;
 
-            body:not(.theme-white) & {
-                border: 0 none;
-                border-right: @scaled-one-px-value-ie solid @border-toolbar-ie;
-                border-right: @scaled-one-px-value solid @border-toolbar;
-                box-shadow: 0 @scaled-one-px-value-ie 0 0 @border-toolbar-ie;
-                box-shadow: 0 @scaled-one-px-value 0 0 @border-toolbar;
-            }
+            border: @celleditor-input-border-ie;
+            border: @celleditor-input-border;
+            border-right: @celleditor-cell-name-border-right-ie;
+            border-right: @celleditor-cell-name-border-right;
+            box-shadow: 0 @celleditor-border-width-ie 0 0 @border-toolbar-ie;
+            box-shadow: 0 @celleditor-border-width 0 0 @border-toolbar;
 
             .rtl & {
                 padding: 0px 4px 0 19px;
                 direction: rtl;
-                body:not(.theme-white) & {
-                    border: 0 none;
-                    border-left: @scaled-one-px-value-ie solid @border-toolbar-ie;
-                    border-left: @scaled-one-px-value solid @border-toolbar;
-                }
+                border: @celleditor-input-border-ie;
+                border: @celleditor-input-border;
+                border-left: @celleditor-cell-name-border-right-ie;
+                border-left: @celleditor-cell-name-border-right;
             }
 
             &[disabled] {
@@ -64,6 +64,7 @@
                 background-color: @background-normal-ie;
                 background-color: transparent;
                 width: 16px;
+                height: @celleditor-height-ie;
                 height: @celleditor-height;
 
                 .inner-box-caret {
@@ -92,11 +93,8 @@
         #ce-func-label {
             height: @x-small-btn-size;
             width: @x-small-btn-size;
-            .margin-left(-3px);
-
-            body.theme-white & {
-                .margin-left(1px);
-            }
+            .margin-left(@celleditor-func-label-margin-left-ie);
+            .margin-left(@celleditor-func-label-margin-left);
 
             .border-radius(0);
 
@@ -108,7 +106,7 @@
 
     &:not(.expanded) {
         #ce-func-label {
-            border-bottom: @celleditor-border-width solid @border-toolbar-ie;
+            border-bottom: @celleditor-border-width-ie solid @border-toolbar-ie;
             border-bottom: @celleditor-border-width solid @border-toolbar;
         }
     }
@@ -128,27 +126,30 @@
     }
 
     .ce-group-content {
-        margin: 0 0px 0 120px;
+        margin: 0 0px 0 calc(100px + 3px + @celleditor-func-label-margin-left-ie + @x-small-btn-size-ie);
+        margin: 0 0px 0 calc(100px + 3px + @celleditor-func-label-margin-left + @x-small-btn-size);
         height: 100%;
         display: flex;
-        border-left: @celleditor-border-width solid @border-toolbar-ie;
+        border-left: @celleditor-border-width-ie solid @border-toolbar-ie;
         border-left: @celleditor-border-width solid @border-toolbar;
         .rtl & {
             border-left: none;
-            border-right: @celleditor-border-width solid @border-toolbar-ie;
+            border-right: @celleditor-border-width-ie solid @border-toolbar-ie;
             border-right: @celleditor-border-width solid @border-toolbar;
-            margin: 0 120px 0 0px;
+            margin: 0 calc(100px + 3px + @celleditor-func-label-margin-left-ie + @x-small-btn-size-ie) 0 0px;
+            margin: 0 calc(100px + 3px + @celleditor-func-label-margin-left + @x-small-btn-size) 0 0px;
         }
 
         #ce-cell-content {
             height: 100%;
             resize: none;
             min-height: 19px;
-            body:not(.theme-white) & {
-                border: 0 none;
-            }
+            border: @celleditor-input-border-ie;
+            border: @celleditor-input-border;
+            box-shadow: none;
             .padding-x(3px, 19px);
             .font-size-medium();
+            line-height: @celleditor-line-height-ie;
             line-height: @celleditor-line-height;
             padding-bottom: 0;
             &::-webkit-scrollbar-button:single-button{
@@ -173,9 +174,8 @@
     }
 
     #ce-cell-name, #ce-cell-content {
-        body:not(.theme-white) & {
-            border-radius: 0
-        }
+        border-radius: @celleditor-input-border-radius-ie;
+        border-radius: @celleditor-input-border-radius;
     }
 
     &+.layout-resizer {
@@ -194,6 +194,7 @@
 
 #ce-btn-expand {
     width: 16px;
+    height: @celleditor-height-ie;
     height: @celleditor-height;
     .border-radius(0);
     background: transparent;