コードプレイグラウンド|HTML/CSS/JavaScript をその場で試せる無料オンラインツール

💰 最大数十%OFFも見つかる

お得な商品をチェック

Amazon

🛍 失敗しない商品選びのヒント

売れている商品を見る

楽天市場

HTML・CSS・JavaScript を書くと、その場でプレビューに反映される無料のオンラインコードエディタです。console.log の出力や実行時のエラーはコンソールに表示され、書いたコードの動きをすぐに確認できます。編集内容は自動保存され、作ったものはHTMLファイルとして保存したり、別タブで開いたりできます。登録もインストールも不要で、スマホからも使えます。Web制作の学習や、ちょっとしたコードの動作確認にお使いください。

使い方

  1. コードを書く:HTML・CSS・JS のタブを切り替えてコードを入力すると、右側のプレビューに自動で反映されます。
  2. 実行する:「▶ 実行」ボタン、または CtrlEnter でも実行できます。「自動実行」をオフにすれば、手動実行のみに切り替えられます。
  3. 結果とエラーを確認する:プレビューの下のコンソールに、console.log の出力や実行時のエラーが表示されます。
  4. 保存・持ち出しをする:編集内容は自動的にブラウザに保存され、ページを再読み込みしても残ります。「保存」でHTMLファイルとしてダウンロード、「新規タブ」で別タブに表示もできます。
  5. サンプルから始める:左上のメニューから、ボタン・時計・カウンター・ToDoリスト・お絵かきなどのサンプルを読み込めます。まずは眺めて、書き換えてみるのがおすすめです。
  6. リンクで共有する:「共有」で、今のコードをそのまま再現できるURLを作成できます。

※プレビューは安全のため隔離環境で実行され、このページには影響しません。無限ループ(例:while(true))はタブが応答しなくなるためご注意ください。

💰 最大数十%OFFも見つかる

お得な商品をチェック

Amazon

🛍 失敗しない商品選びのヒント

売れている商品を見る

楽天市場

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!