diff --git a/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.html b/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.html
index 1d708f060a..8d69bf6539 100644
--- a/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.html
@@ -65,7 +65,7 @@
       </div>
       <ng-container [formGroup]="configFormGroup">
         <div class="tb-form-panel">
-          <div class="tb-form-panel-title">{{ 'calculated-fields.arguments' | translate }}*</div>
+          <div class="tb-form-panel-title tb-required">{{ 'calculated-fields.arguments' | translate }}</div>
           <tb-calculated-field-arguments-table
             formControlName="arguments"
             [entityId]="data.entityId"
@@ -75,7 +75,7 @@
           />
         </div>
         <div class="tb-form-panel">
-          <div class="tb-form-panel-title">{{ 'calculated-fields.expression' | translate }}*</div>
+          <div class="tb-form-panel-title tb-required">{{ 'calculated-fields.expression' | translate }}</div>
           @if (fieldFormGroup.get('type').value === CalculatedFieldType.SIMPLE) {
             <mat-form-field class="mat-block" appearance="outline">
               <input matInput formControlName="expressionSIMPLE" maxlength="255" [placeholder]="'action.set' | translate" required>
diff --git a/ui-ngx/src/form.scss b/ui-ngx/src/form.scss
index 0ae2b9584b..4c00a330c7 100644
--- a/ui-ngx/src/form.scss
+++ b/ui-ngx/src/form.scss
@@ -163,6 +163,13 @@
   .tb-form-panel-title {
     font-weight: 500;
     font-size: 16px;
+
+    &.tb-required::after {
+      font-size: 13px;
+      color: rgba(0, 0, 0, .54);
+      vertical-align: top;
+      content: " *";
+    }
   }
   .tb-form-panel-hint {
     font-size: 12px;