無料 HTMLファイルプレビュー

使い方

1. プレビューするHTMLファイルをドラッグ＆ドロップするか、クリックしてアップロードします。CSS・JS・画像・複数ページやフォルダを「ファイル・フォルダを追加」エリアにドラッグ＆ドロップすると一緒にアップロードされ、「新規ファイル」「新規フォルダ」で直接作ったりコードを貼り付けたりもできます。
2. 左の「ファイル」一覧でファイルをクリックするとコードが開きます。HTMLを選ぶとそのページがプレビューされます。
3. コードエリアを編集すると、「自動更新」がオンのとき右側の結果がリアルタイムで更新されます。プレビュー内のリンクを押すとそのページに遷移します。
4. プレビューの幅をデスクトップ・タブレット・モバイルに変えてレスポンシブ画面を確認します。
5. 「新規ウィンドウで開く」で全画面確認、「ファイルをダウンロード」で現在のファイルを保存、「コードをコピー」でコードをクリップボードに入れます。

この無料HTMLプレビューツールの特徴

• 完全無料・登録不要・インストール不要 — オンラインですぐに使用
• ブラウザ内で処理され、ファイルが外部に送信されない安全なプレビュー
• HTML1つからCSS・JS・画像・複数ページ、フォルダまるごとアップロードまで対応
• 相対パス（../, ./）とCSS・JS・画像の自動連携、ページ間リンク遷移に対応
• デスクトップ・タブレット・モバイル幅の切り替えでレスポンシブレイアウトを確認
• 隔離されたsandboxフレームでJavaScriptまで安全に実行
• 新規ウィンドウ表示・コードコピー・ファイルダウンロードに対応

よくある質問

HTMLファイルプレビューは無料ですか？

はい、完全無料です。登録やソフトのインストールなしで、ブラウザからすぐにご利用いただけます。

アップロードしたHTMLファイルはサーバーに送信されますか？

いいえ。ファイルの読み込みとプレビューの描画はすべて利用者のブラウザ内で行われ、ファイルが外部サーバーに送信されることはありません。

コードを直接入力してプレビューできますか？

はい。ファイルをアップロードせずにHTMLコードを貼り付けたり入力したりすると、右側に結果がリアルタイムで表示されます。

CSS・JS・画像が分かれたプロジェクトやフォルダもプレビューできますか？

はい。複数のファイルを一緒にアップロードしたりフォルダをまるごとアップロードしたりすると、相対パスで結び付いたCSS・JS・画像が自動で反映され、ページ間のリンク遷移も行えます。.phpファイルはブラウザ内のPHPサブセット解釈器で基本文法（echo・変数・配列・条件・繰り返し文・よく使う組み込み関数）まで実行されます。ただしサーバーがないため、DB接続・ファイル読み込み・ネットワークリクエストといったサーバー機能や、実行中にfetchでファイルを読み込むコードは動作しません。

モバイル画面でどう見えるか確認できますか？

はい。プレビューの幅をデスクトップ・タブレット・モバイルに切り替えて、レスポンシブレイアウトの見え方を確認できます。

プレビュー内のJavaScriptも実行されますか？

はい。プレビューは隔離されたsandboxフレームで実行されるため、ページに影響を与えることなくHTMLとJavaScriptの動作を確認できます。