diff --git a/templates/common/base.html b/templates/common/base.html
index 00697a26..54005e8e 100644
--- a/templates/common/base.html
+++ b/templates/common/base.html
@@ -330,6 +330,12 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
         font-weight: 600 !important;
         font-size: 1.3rem !important;
     }
+
+    .readonly-input {
+        color: var(--bs-text-gray-800);
+        font-weight: 500 !important;
+        font-size: 1.1rem !important;
+    }
 </style>
 {{- end}}
 
diff --git a/templates/webadmin/folder.html b/templates/webadmin/folder.html
index f87f18a1..8991baed 100644
--- a/templates/webadmin/folder.html
+++ b/templates/webadmin/folder.html
@@ -91,8 +91,8 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="idFolderName" data-i18n="general.name" class="col-md-3 col-form-label">Name</label>
                 <div class="col-md-9">
-                    <input id="idFolderName" type="text" class="form-control" placeholder="" name="name" value="{{.Folder.Name}}"
-                        maxlength="255" autocomplete="off" spellcheck="false" required {{if ge .Mode 2}}readonly{{end}} />
+                    <input id="idFolderName" type="text" placeholder="" name="name" value="{{.Folder.Name}}" maxlength="255" autocomplete="off"
+                        spellcheck="false" required {{if ge .Mode 2}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}} />
                 </div>
             </div>
             {{- end}}
diff --git a/templates/webadmin/group.html b/templates/webadmin/group.html
index b4fa13e5..d2a78e77 100644
--- a/templates/webadmin/group.html
+++ b/templates/webadmin/group.html
@@ -27,8 +27,8 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="idGroupName" data-i18n="general.name" class="col-md-3 col-form-label">Name</label>
                 <div class="col-md-9">
-                    <input id="idGroupName" type="text" class="form-control" placeholder="" name="name" value="{{.Group.Name}}"
-                        maxlength="255" autocomplete="off" spellcheck="false" required {{if eq .Mode 2}}readonly{{end}} />
+                    <input id="idGroupName" type="text" placeholder="" name="name" value="{{.Group.Name}}" maxlength="255" autocomplete="off"
+                        spellcheck="false" required {{if eq .Mode 2}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}} />
                 </div>
             </div>
 
diff --git a/templates/webadmin/role.html b/templates/webadmin/role.html
index 9d7a286c..d8830d53 100644
--- a/templates/webadmin/role.html
+++ b/templates/webadmin/role.html
@@ -27,8 +27,8 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="idRoleName" data-i18n="general.name" class="col-md-3 col-form-label">Name</label>
                 <div class="col-md-9">
-                    <input id="idRoleName" type="text" class="form-control" placeholder="" name="name" value="{{.Role.Name}}"
-                        maxlength="255" autocomplete="off" spellcheck="false" required {{if eq .Mode 2}}readonly{{end}} />
+                    <input id="idRoleName" type="text" placeholder="" name="name" value="{{.Role.Name}}" maxlength="255" autocomplete="off"
+                        spellcheck="false" required {{if eq .Mode 2}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}} />
                 </div>
             </div>
 
diff --git a/templates/webadmin/user.html b/templates/webadmin/user.html
index 82aa7435..6fb0978a 100644
--- a/templates/webadmin/user.html
+++ b/templates/webadmin/user.html
@@ -99,8 +99,8 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="idUsername" data-i18n="login.username" class="col-md-3 col-form-label">Username</label>
                 <div class="col-md-9">
-                    <input id="idUsername" type="text" class="form-control" placeholder="" name="username" value="{{.User.Username}}"
-                        maxlength="255" autocomplete="off" spellcheck="false" required {{if ge .Mode 2}}readonly{{end}} />
+                    <input id="idUsername" type="text" placeholder="" name="username" value="{{.User.Username}}" maxlength="255" autocomplete="off"
+                        spellcheck="false" required {{if ge .Mode 2}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}} />
                 </div>
             </div>
             {{- end}}
diff --git a/templates/webclient/profile.html b/templates/webclient/profile.html
index 5eb38955..e572f43d 100644
--- a/templates/webclient/profile.html
+++ b/templates/webclient/profile.html
@@ -26,16 +26,16 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="idEmail" data-i18n="general.email" class="col-md-3 col-form-label">Email</label>
                 <div class="col-md-9">
-                    <input type="text" class="form-control" id="idEmail" name="email" placeholder="" spellcheck="false"
-                        value="{{.Email}}" maxlength="255" autocomplete="off" {{if not .LoggedUser.CanChangeInfo}}readonly{{end}}>
+                    <input type="text" id="idEmail" name="email" placeholder="" spellcheck="false" value="{{.Email}}" maxlength="255"
+                        autocomplete="off" {{if not .LoggedUser.CanChangeInfo}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}}>
                 </div>
             </div>
 
             <div class="form-group row mt-10">
                 <label for="idDescription" data-i18n="general.description" class="col-md-3 col-form-label">Description</label>
                 <div class="col-md-9">
-                    <input type="text" class="form-control" id="idDescription" name="description" placeholder=""
-                        value="{{.Description}}" maxlength="255" {{if not .LoggedUser.CanChangeInfo}}readonly{{end}}>
+                    <input type="text" id="idDescription" name="description" placeholder="" value="{{.Description}}" maxlength="255"
+                        {{if not .LoggedUser.CanChangeInfo}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}}>
                 </div>
             </div>
 
diff --git a/templates/webclient/share.html b/templates/webclient/share.html
index b2440a99..4bc2a8c5 100644
--- a/templates/webclient/share.html
+++ b/templates/webclient/share.html
@@ -26,8 +26,8 @@ explicit grant from the SFTPGo Team (support@sftpgo.com).
             <div class="form-group row">
                 <label for="name" data-i18n="general.name" class="col-md-3 col-form-label">Name</label>
                 <div class="col-md-9">
-                    <input id="name" type="text" class="form-control" placeholder="" name="name" value="{{.Share.Name}}"
-                        maxlength="255" autocomplete="off" required {{if not .IsAdd}}readonly{{end}} />
+                    <input id="name" type="text" placeholder="" name="name" value="{{.Share.Name}}" maxlength="255" autocomplete="off"
+                        required {{if not .IsAdd}}class="form-control-plaintext readonly-input" readonly{{else}}class="form-control"{{end}} />
                 </div>
             </div>