diff --git a/fe/fe-core/src/main/java/org/apache/doris/httpv2/controller/QueryProfileController.java b/fe/fe-core/src/main/java/org/apache/doris/httpv2/controller/QueryProfileController.java
index 614438e7714b0f..d86ab6019926a5 100644
--- a/fe/fe-core/src/main/java/org/apache/doris/httpv2/controller/QueryProfileController.java
+++ b/fe/fe-core/src/main/java/org/apache/doris/httpv2/controller/QueryProfileController.java
@@ -54,6 +54,8 @@ public Object profile(@PathVariable(value = ID) String id) {
         if (profile == null) {
             return ResponseEntityBuilder.okWithCommonError("ID " + id + " does not exist");
         }
+        profile = profile.replaceAll("\n", "</br>");
+        profile = profile.replaceAll(" ", "&nbsp;&nbsp;");
         return ResponseEntityBuilder.ok(profile);
     }
 
diff --git a/ui/src/pages/query-profile/index.tsx b/ui/src/pages/query-profile/index.tsx
index 1ca1547b961d5a..a71698cec40f6c 100644
--- a/ui/src/pages/query-profile/index.tsx
+++ b/ui/src/pages/query-profile/index.tsx
@@ -190,7 +190,7 @@ export default function QueryProfile(params: any) {
             {profile ? (
                 <div
                     ref={container}
-                    style={{ background: '#f9f9f9', padding: '20px', whiteSpace: 'pre-wrap', wordSpacing: '4px' }}
+                    style={{ background: '#f9f9f9', padding: '20px' }}
                 >
                     {/* {profile} */}
                 </div>