OpenMax 公式無料ツール

無料 HTML・Markdown ライブプレビュー

HTML または Markdown を貼り付けると、サンドボックス化した iframe にプレビューがすぐ表示されます。処理はすべてブラウザ内で行われ、入力内容は外部に送信されません。

ツールを使う OpenMax で同様のツールを作る →

HTMLライブプレビュー

MarkdownMD から HTML へ

サンドボックス分離された iframe

ソースHTML をプレビュー

入力

HTML

Markdown

自動

ライブプレビュー

プレビュー

ソース

このツールについて

OpenMax の無料 HTML・Markdown ライブプレビューでは、入力したコードをサンドボックス化した iframe にすぐ表示できます。

OpenMax にアクセス

よくある質問

このツールはスクリプトを実行しますか？

はい。ただし、スクリプトはメインページから分離されたサンドボックス iframe 内でのみ実行されます。

Markdown に対応していますか？

はい。Markdown モードでは、見出し、太字・斜体、リンク、インラインコード、引用、箇条書き、表をプレビューできます。

プレビュー結果をダウンロードできますか？

はい。［HTML をダウンロード］を選択すると、現在の HTML または Markdown のレンダリング結果を HTML ファイルとして保存できます。

OpenMax で同様のツールを作る →

\nAI エージェントチームを導入\n

OpenMax は、対応チャネルへの AI エージェント導入を支援します。

マルチエージェント

AI エージェントがコンテキストを共有し、連携して処理します。

チャネル連携

対応する業務・メッセージングチャネルに接続します。

ガイド付きセットアップ

所要時間は連携先によって異なりますが、通常 10〜20 分です。

.*<\/li>\n?)+/g,"

$&") .replace(/((\|.+\|[\r\n])+\|[\-|:]+\|[\r\n](\|.+\|)([\r\n]\|.+\|)*)/g, function(match){ var lines = match.trim().split(/\r?\n/); var html = ''; for(var i = 0; i < lines.length; i++){ var cells = lines[i].split('|').filter(function(c){return c.trim()}); if(i === 1) continue; // skip separator var tag = i === 0 ? 'th' : 'td'; html += '' + cells.map(function(c){return '<'+tag+'>'+c.trim()+''}).join('') + ''; } return html + '

'; }).replace(/\[(.+?)\]$(.+?)$/g,function(_,label,url){ var href=url.trim(); if(!/^(https?:\/\/|mailto:|#|\/)/i.test(href))href="#"; href=href.replace(/"/g,""").replace(/'/g,"'"); return ''+label+''; }) .replace(/\n\n/g,"

").replace(/\n/g,"
"); out = " "+out+" "; } } renderedOutput = out; preview.srcdoc = out; } // Buttons document.getElementById("btnRender").addEventListener("click", render); document.getElementById("btnClear").addEventListener("click", function(){ inp.value=""; render(); }); document.getElementById("btnCopyHTML").addEventListener("click", function(){ var out = mode==="md" ? inp.value.replace(/&/g,"&").replace(//g,">").replace(/^### (.+)$/gm,"

$1

").replace(/^## (.+)$/gm,"

$1

").replace(/^# (.+)$/gm,"$1").replace(/\*\*(.+?)\*\*/g,"$1").replace(/\*(.+?)\*/g,"$1").replace(/`(.+?)`/g,"$1").replace(/^> (.+)$/gm,"

$1

").replace(/^- (.+)$/gm,"

.*<\/li>\n?)+/g,"

$&").replace(/((\|.+\|[\r\n])+\|[\-|:]+\|[\r\n](\|.+\|)([\r\n]\|.+\|)*)/g, function(match){ var lines = match.trim().split(/\r?\n/); var html = ''; for(var i = 0; i < lines.length; i++){ var cells = lines[i].split('|').filter(function(c){return c.trim()}); if(i === 1) continue; // skip separator var tag = i === 0 ? 'th' : 'td'; html += '' + cells.map(function(c){return '<'+tag+'>'+c.trim()+''}).join('') + ''; } return html + '

'; }).replace(/\[(.+?)\]$(.+?)$/g,function(_,label,url){ var href=url.trim(); if(!/^(https?:\/\/|mailto:|#|\/)/i.test(href))href="#"; href=href.replace(/"/g,""").replace(/'/g,"'"); return ''+label+''; }).replace(/\n\n/g,"

").replace(/\n/g,"
") : inp.value; navigator.clipboard.writeText(out); T("HTML をコピーしました"); }); document.getElementById("btnCopyMD").addEventListener("click", function(){ navigator.clipboard.writeText(inp.value); T("Markdown をコピーしました"); }); // Samples document.getElementById("btnSampleHTML").addEventListener("click", function(){ inp.value="\n\n\n\n\nOpenMax\n\n \n\n

\nAI エージェントチームを導入\n

OpenMax は、対応チャネルへの AI エージェント導入を支援します。

マルチエージェント

AI エージェントがコンテキストを共有し、連携して処理します。

チャネル連携

対応する業務・メッセージングチャネルに接続します。

ガイド付きセットアップ

所要時間は連携先によって異なりますが、通常 10〜20 分です。

\n \n"; render(); }); document.getElementById("btnSampleMD").addEventListener("click", function(){ inp.value="# AI エージェントチームを導入\n\n**OpenMax** は、対応チャネルへの AI エージェント導入を支援します。\n\n## ワークフローに含まれる機能\n\n- **マルチエージェント連携** — ワークフロー内でコンテキストを共有できます\n- **チャネル連携** — 対応する業務・メッセージングチャネルに接続できます\n- **ガイド付きセットアップ** — 所要時間は連携先によって異なりますが、通常 10〜20 分です\n- **人による確認** — 重要な操作に確認担当者を設定できます\n\n> 人のチームと AI エージェントが、製品開発やサポートのワークフローで連携します。\n\n[OpenMax を見る](https://openmax.com)"; render(); }); function T(m){ var t=document.getElementById("tl"); t.textContent=m; t.style.display="block"; clearTimeout(t._t); t._t=setTimeout(function(){t.style.display="none"},1600); } // Source view document.getElementById("tabPreview").addEventListener("click", function(){ document.getElementById("tabPreview").className = "tab active"; document.getElementById("tabSource").className = "tab"; document.getElementById("preview").style.display = "block"; document.getElementById("sourceView").style.display = "none"; }); document.getElementById("tabSource").addEventListener("click", function(){ document.getElementById("tabSource").className = "tab active"; document.getElementById("tabPreview").className = "tab"; document.getElementById("preview").style.display = "none"; document.getElementById("sourceView").style.display = "block"; updateSourceView(); }); function updateSourceView(){ if(document.getElementById("sourceView").style.display === "none") return; var code = inp.value; if(mode === "md"){ if(!code){ document.getElementById("sourceView").textContent = ""; } else { var html = code.replace(/&/g,"&").replace(//g,">").replace(/^### (.+)$/gm,"

$1

").replace(/^## (.+)$/gm,"

$1

").replace(/^# (.+)$/gm,"$1").replace(/\*\*(.+?)\*\*/g,"$1").replace(/\*(.+?)\*/g,"$1").replace(/`(.+?)`/g,"$1").replace(/^> (.+)$/gm,"

$1

").replace(/^- (.+)$/gm,"

.*<\/li>\n?)+/g,"

$&").replace(/((\|.+\|[\r\n])+\|[\-|:]+\|[\r\n](\|.+\|)([\r\n]\|.+\|)*)/g, function(match){ var lines = match.trim().split(/\r?\n/); var html = ''; for(var i = 0; i < lines.length; i++){ var cells = lines[i].split('|').filter(function(c){return c.trim()}); if(i === 1) continue; // skip separator var tag = i === 0 ? 'th' : 'td'; html += '' + cells.map(function(c){return '<'+tag+'>'+c.trim()+''}).join('') + ''; } return html + '

'; }).replace(/\[(.+?)\]$(.+?)$/g,'$1').replace(/\n\n/g,"

").replace(/\n/g,"
"); var full = "\n\n\n\n \n\n" + html + "\n \n"; document.getElementById("sourceView").textContent = full; } } else { document.getElementById("sourceView").textContent = code || ""; } } // Init setTimeout(function(){render();},100); window.downloadPage = function(){ var c=mode==="md"?renderedOutput:inp.value; if(!c)c=renderedOutput||"OpenMax "; var b=new Blob([c],{type:"text/html"});var a=document.createElement("a");a.href=URL.createObjectURL(b);a.download="preview.html";a.click();T("ダウンロードしました") } })();

無料 HTML・Markdown ライブプレビュー

このツールについて

よくある質問

関連する開発者向けツール

マルチエージェント

チャネル連携

ガイド付きセットアップ

$1

$1

$1

$1

マルチエージェント

チャネル連携

ガイド付きセットアップ

$1

$1