💻
開発者ツール
開発者ツール
HCJ
HHTML
에디터 로딩 중…
開発者ツールの機能
HTML・CSS・JavaScriptをブラウザ上で直接編集し、リアルタイムでプレビューできます。 シンタックスハイライト・括弧自動補完・ダーク/ライトモードのテーマに対応しています。 共有リンクを生成してコードを簡単に共有したり、後で復元することも可能です。
使い方
① HTML・CSS・JSタブから編集したい言語タブを選択します。 ② コードを入力すると600ms後にプレビューパネルが自動更新されます。 ③ ツールバーのダーク/ライトモードボタンでテーマを切り替えられます。 ④ 共有ボタンを押すと現在のコードをURL化した共有リンクがコピーされます。
こんな時に使います
• HTML・CSSレイアウトのアイデアを素早くプロトタイプ • JavaScriptのコードスニペットをテスト • チームメンバーやコミュニティにコード例を共有 • シンプルなWebページ構造の確認・学習
よくある質問
- Q. どの言語に対応していますか?
- A. HTML・CSS・JavaScriptの3言語に対応しています。各言語に対応したシンタックスハイライトと括弧自動補完が提供されます。
- Q. 作成したコードを保存・共有できますか?
- A. 「共有」ボタンを押すと現在のコードがURLハッシュにエンコードされた共有リンクがクリップボードにコピーされます。このリンクで同じコード状態をいつでも復元できます。
- Q. プレビューは自動で更新されますか?
- A. はい、コードを編集すると600ms後に自動でプレビューが更新されます。実行ボタンを押す必要はありません。
- Q. エディタのテーマを変えられますか?
- A. ツールバーの☀️/🌙ボタンでダークモード(Dracula)とライトモード(Eclipse)を切り替えられます。
- Q. HTML/CSS/JSファイルを読み込めますか?
- A. 現在は直接コードを入力するか共有リンクから読み込む方法をサポートしています。ファイルアップロード機能は今後追加予定です。