HTMLプレビュー
HTMLを貼り付けて、Webページとして表示。スマホでもPCでも、ブラウザだけで確認できます。
入力したHTMLは送信・保存されません。
HTML全体やHTMLの一部分を貼り付けて、表示ボタンを押してください。
PC幅では入力が止まると自動でプレビューを更新します。JavaScriptを実行する場合はボタンで更新してください。
信頼できるHTMLの場合だけ有効にしてください。親画面へのアクセス・ストレージ・外部リソース取得・フォーム送信を制限した環境で動かします。
プレビュー
ブラウザ内のみHTMLを貼り付けると、ここにプレビューを表示できます。
対応CDNとMermaidの使い方
以下の固定URLのCSSに対応します。Mermaidはpreまたはdivにclass="mermaid"を付けると自動で描画します。CDNを使う場合はインターネット接続が必要です。
- Bootstrap 5.3.8
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css"> - Font Awesome 7.3.0
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.3.0/css/all.min.css">
- Noto Sans JP
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap"> - JetBrains Mono
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&display=swap">
Mermaid 12.2.0
<pre class="mermaid"> graph TD A[HTML] --> B[Preview] </pre>