diff --git a/tools/spec-gen-sdk/package-lock.json b/tools/spec-gen-sdk/package-lock.json
index 63ba531c60e..4d96717e44f 100644
--- a/tools/spec-gen-sdk/package-lock.json
+++ b/tools/spec-gen-sdk/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@azure-tools/spec-gen-sdk",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@azure-tools/spec-gen-sdk",
-      "version": "0.1.2",
+      "version": "0.1.3",
       "license": "MIT",
       "dependencies": {
         "ajv": "^6.12.6",
@@ -14,6 +14,7 @@
         "handlebars": "~4.7.7",
         "jsonc-parser": "^2.3.1",
         "lodash": "^4.17.20",
+        "marked": "^15.0.6",
         "prettier": "2.1.2",
         "simple-git": "^3.16.0",
         "winston": "^3.3.3",
@@ -28,6 +29,7 @@
         "@eslint/js": "^9.14.0",
         "@types/jest": "^29.5.11",
         "@types/lodash": "^4.14.161",
+        "@types/marked": "^5.0.2",
         "@types/node": "^18.19.64",
         "@types/prettier": "^2.1.5",
         "@types/rimraf": "^3.0.0",
@@ -1506,6 +1508,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/marked": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/@types/marked/-/marked-5.0.2.tgz",
+      "integrity": "sha512-OucS4KMHhFzhz27KxmWg7J+kIYqyqoW5kdIEI319hqARQQUTqhao3M/F+uFnDXD0Rg72iDDZxZNxq5gvctmLlg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/minimatch": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz",
@@ -4243,6 +4252,18 @@
         "tmpl": "1.0.5"
       }
     },
+    "node_modules/marked": {
+      "version": "15.0.6",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-15.0.6.tgz",
+      "integrity": "sha512-Y07CUOE+HQXbVDCGl3LXggqJDbXDP2pArc2C1N1RRMN0ONiShoSsIInMd5Gsxupe7fKLpgimTV+HOJ9r7bA+pg==",
+      "license": "MIT",
+      "bin": {
+        "marked": "bin/marked.js"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
diff --git a/tools/spec-gen-sdk/package.json b/tools/spec-gen-sdk/package.json
index 6cf3bb03469..3483333e3b0 100644
--- a/tools/spec-gen-sdk/package.json
+++ b/tools/spec-gen-sdk/package.json
@@ -37,6 +37,7 @@
     "handlebars": "~4.7.7",
     "jsonc-parser": "^2.3.1",
     "lodash": "^4.17.20",
+    "marked": "^15.0.6",
     "prettier": "2.1.2",
     "simple-git": "^3.16.0",
     "winston": "^3.3.3",
@@ -51,6 +52,7 @@
     "@eslint/js": "^9.14.0",
     "@types/jest": "^29.5.11",
     "@types/lodash": "^4.14.161",
+    "@types/marked": "^5.0.2",
     "@types/node": "^18.19.64",
     "@types/prettier": "^2.1.5",
     "@types/rimraf": "^3.0.0",
diff --git a/tools/spec-gen-sdk/src/automation/entrypoint.ts b/tools/spec-gen-sdk/src/automation/entrypoint.ts
index df0a64c034a..88b2f9e9115 100644
--- a/tools/spec-gen-sdk/src/automation/entrypoint.ts
+++ b/tools/spec-gen-sdk/src/automation/entrypoint.ts
@@ -17,7 +17,7 @@ import {
   sdkAutoLogLevels
 } from './logging';
 import path from 'path';
-import { generateReport, saveFilteredLog } from './reportStatus';
+import { generateReport, generateHtmlFromFilteredLog, saveFilteredLog } from './reportStatus';
 import { SpecConfig, SdkRepoConfig, getSpecConfig, specConfigPath } from '../types/SpecConfig';
 import { getSwaggerToSdkConfig, SwaggerToSdkConfig } from '../types/SwaggerToSdkConfig';
 
@@ -46,6 +46,7 @@ export type SdkAutoContext = {
   logger: winston.Logger;
   fullLogFileName: string;
   filteredLogFileName: string;
+  htmlLogFileName: string;
   specRepoConfig: SpecConfig;
   sdkRepoConfig: SdkRepoConfig;
   swaggerToSdkConfig: SwaggerToSdkConfig
@@ -68,6 +69,8 @@ export const getSdkAutoContext = async (options: SdkAutoOptions): Promise<SdkAut
 
   const fullLogFileName = path.join(options.workingFolder, 'full.log');
   const filteredLogFileName = path.join(options.workingFolder, 'filtered.log');
+  // eg: spec-gen-sdk-java-result.html
+  const htmlLogFileName = path.join(options.workingFolder, `spec-gen-sdk-${options.sdkName.substring("azure-sdk-for-".length)}-result.html`);
   if (fs.existsSync(fullLogFileName)) {
     fs.rmSync(fullLogFileName);
   }
@@ -86,6 +89,7 @@ export const getSdkAutoContext = async (options: SdkAutoOptions): Promise<SdkAut
   const swaggerToSdkConfig = getSwaggerToSdkConfig(swaggerToSdkConfigContent);
 
   return {
+    htmlLogFileName,
     config: options,
     logger,
     fullLogFileName,
@@ -117,7 +121,8 @@ export const sdkAutoMain = async (options: SdkAutoOptions) => {
   }
   if (workflowContext) {
     generateReport(workflowContext);
-    saveFilteredLog(workflowContext);
+    await saveFilteredLog(workflowContext);
+    await generateHtmlFromFilteredLog(workflowContext);
   }
   await loggerWaitToFinish(sdkContext.logger);
   return workflowContext?.status;
diff --git a/tools/spec-gen-sdk/src/automation/reportStatus.ts b/tools/spec-gen-sdk/src/automation/reportStatus.ts
index b6234083276..71121073f88 100644
--- a/tools/spec-gen-sdk/src/automation/reportStatus.ts
+++ b/tools/spec-gen-sdk/src/automation/reportStatus.ts
@@ -13,6 +13,7 @@ import { CommentCaptureTransport } from './logging';
 import { ExecutionReport, PackageReport } from '../types/ExecutionReport';
 import { writeTmpJsonFile } from '../utils/fsUtils';
 import { getGenerationBranchName } from '../types/PackageData';
+import { marked } from "marked";
 
 const commentLimit = 60;
 
@@ -146,6 +147,142 @@ export const saveFilteredLog = async (context: WorkflowContext) => {
   context.logger.log('endsection', 'Save filtered log status');
 };
 
+export const generateHtmlFromFilteredLog = async (context: WorkflowContext) => {
+    context.logger.log('section', 'Generate HTML from filtered log');
+    const RegexMarkdownSplit = /^(.*?)(<ul>.*)$/s;
+    const RegexNoteBlock = /> \[!NOTE\]\s*>\s*(.*)/;
+    let messageRecord: string | undefined = undefined;
+    try {
+        messageRecord = fs.readFileSync(context.filteredLogFileName).toString();
+    } catch (error) {
+        context.logger.error(`IOError: Fails to read log in'${context.filteredLogFileName}', Details: ${error}`)
+        return;
+    }
+
+    const parseMessageRecord = JSON.parse(messageRecord) as MessageRecord[];
+
+    let pageBody = '';
+    for(let commentBody of parseMessageRecord) {
+        const markdown = commentBody.message || '';
+        if (markdown.trim().length === 0) continue;
+        let noteBlockInfo = '';
+        let mainContent = '';
+        
+        const match = markdown.match(RegexMarkdownSplit);
+        if (match !== null) { 
+            mainContent = match[2].trim(); 
+            const noteBlock = match[1].trim();
+            const noteBlockMatch = noteBlock.match(RegexNoteBlock);
+            if (noteBlockMatch !== null) {
+                noteBlockInfo = noteBlockMatch[1].trim();
+            }
+        } else {
+            mainContent = marked(markdown) as string;
+        }
+        const noteBlockHtml = noteBlockInfo && generateNoteBlockTemplate(noteBlockInfo);
+        pageBody += (noteBlockHtml  + mainContent);
+    }
+
+    // eg: spec-gen-sdk-net result
+    const pageTitle = `spec-gen-sdk-${context.config.sdkName.substring("azure-sdk-for-".length)} result`;
+    const generatedHtml: string = generateHtmlTemplate(pageBody, pageTitle );
+    
+    context.logger.info(`Writing html to ${context.htmlLogFileName}`);
+    fs.writeFileSync(context.htmlLogFileName, generatedHtml , "utf-8");
+    context.logger.log('endsection', 'Generate HTML from filtered log');
+}
+
+function generateHtmlTemplate(pageBody:string, pageTitle:string):string {
+    const githubStylesheet = "https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.2.0/github-markdown.min.css";
+    return `
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>${pageTitle}</title>
+    <link rel="stylesheet" href="${githubStylesheet}">
+    <style>
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+            line-height: 1.6;
+            padding: 40px;
+        }
+        .markdown-body {
+            box-sizing: border-box;
+            min-width: 200px;
+            max-width: 980px;
+            margin: 0 auto;
+        }
+        table {
+            border-collapse: collapse;
+            border-spacing: 0;
+        }
+        a {
+            text-decoration: underline!important;
+            text-underline-offset: .2rem!important;
+        }
+         /* GitHub Special prompt block */
+        .markdown-alert.markdown-alert-note {
+            border-left-color: #0969da;
+        }
+        .markdown-alert.markdown-alert-note .markdown-alert-title {
+            color: #0969da;
+        }
+        .markdown-body>*:first-child {
+            margin-top: 0 !important;
+        }
+        .markdown-alert {
+           padding: 0.5rem 1rem;
+           margin-bottom: 1rem;
+           color: inherit;
+           border-left: .25em solid #d1d9e0;
+        }
+        .markdown-alert .markdown-alert-title {
+            display: flex;
+            font-weight: 500;
+            align-items: center;
+            line-height: 1;
+        }
+        .markdown-alert>:first-child {
+            margin-top: 0;
+        }
+        .markdown-body p, .markdown-body blockquote, .markdown-body ul, .markdown-body ol, .markdown-body dl, .markdown-body table, .markdown-body pre, .markdown-body details {
+            margin-top: 0;
+            margin-bottom: 1rem;
+        }
+        .mr-2 {
+            margin-right: 0.5rem !important;
+        }
+        .octicon {
+            display: inline-block;
+            overflow: visible !important;
+            vertical-align: text-bottom;
+            fill: currentColor;
+        }
+    </style>
+</head>
+<body>
+    <article class="markdown-body">
+        ${pageBody}
+    </article>
+</body>
+</html>
+`;
+}
+
+function generateNoteBlockTemplate(noteBlockInfo: string):string {
+return `
+<div class="markdown-alert markdown-alert-note" dir="auto">
+    <p class="markdown-alert-title" dir="auto">
+    <svg class="octicon octicon-info mr-2" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg>
+        Note
+    </p>
+    <p dir="auto">${noteBlockInfo}</p>
+</div>
+`
+}
+
 export const sdkAutoReportStatus = async (context: WorkflowContext) => {
   context.logger.log('section', 'Report status');
 
diff --git a/tools/spec-gen-sdk/src/templates/commentDetailNew.handlebars b/tools/spec-gen-sdk/src/templates/commentDetailNew.handlebars
index e1127b4b8a2..ad153a836ef 100644
--- a/tools/spec-gen-sdk/src/templates/commentDetailNew.handlebars
+++ b/tools/spec-gen-sdk/src/templates/commentDetailNew.handlebars
@@ -14,6 +14,8 @@
       <span>{{renderStatus status}}<b>{{name}}</b>
         {{#if generationPullRequestUrl}}
         [<a href="{{generationPullRequestUrl}}">Preview {{config.sdkName}} Changes</a>]
+        {{else}}
+            &nbsp;
         {{/if}}
         {{#if (shouldRender hasBreakingChange isBetaMgmtSdk)}}
         <b>Breaking Change Detected</b>