diff --git a/projects/common/element-components/text.component.ts b/projects/common/element-components/text.component.ts
index ddb0124ef63a48a84242c33de571b679e2e729ff..c7b229a889b53ff51f21adb898247579584bf4b8 100644
--- a/projects/common/element-components/text.component.ts
+++ b/projects/common/element-components/text.component.ts
@@ -9,9 +9,9 @@ import { TextElement } from '../models/text-element';
   template: `
     <div [style.width.%]="100"
          [style.height]="'auto'">
-      <div *ngIf="elementModel.highlightable"
+      <div *ngIf="elementModel.interaction !== 'none'"
            class="marking-bar">
-        <ng-container *ngIf="elementModel.highlightable">
+        <ng-container *ngIf="elementModel.interaction === 'highlightable'">
           <button class="marking-button" mat-mini-fab [style.background-color]="'yellow'"
                   (click)="onMarkingButtonClick($event, { mode: 'mark', color:'yellow', element: container })">
             <mat-icon>border_color</mat-icon>
@@ -25,6 +25,12 @@ import { TextElement } from '../models/text-element';
             <mat-icon>border_color</mat-icon>
           </button>
         </ng-container>
+        <ng-container *ngIf="elementModel.interaction === 'underlinable'">
+          <button class="marking-button" mat-mini-fab [style.background-color]="'white'"
+                  (click)="onMarkingButtonClick($event, { mode: 'underline', color: 'black', element: container })">
+            <mat-icon>format_underlined</mat-icon>
+          </button>
+        </ng-container>
         <button class="marking-button" [style.background-color]="'lightgrey'" mat-mini-fab
                 (click)="onMarkingButtonClick($event, { mode: 'delete', color: 'none', element: container })">
           <mat-icon>clear</mat-icon>