コード整形・Beautifier(HTML・CSS・JS・PHP・Java・Kotlin・Python・SQL…)
HTML・CSS・JS・JSON・PHP・Java・Kotlin・Shell・Python・SQL・XML・YAMLをタブまたはスペース(2・4・8)で整え、コピーや色付きHTMLとして書き出せます。コードはサーバーに送信されません。
「HTMLとしてコピー」は、色がインラインスタイルで付いた <pre><code> の断片です。ブログや文書にそのまま貼っても色が保たれます。
カラープレビュー
入力したコードはこのブラウザ内だけで処理され、サーバーには送信されません。整形は空白と改行だけを変えるのが原則ですが、重要なコードは整形後にもう一度確認してください。
整形の仕組み
- HTML・CSS・JS・JSONはオープンソースのjs-beautify(MIT)で、PHP・Java・Kotlin・Shell・Python・SQL・XML・YAMLはこのサイトが自作した整形器で処理します。
- 自作の整形器は文字列・コメント・数値・識別子を変えず、トークン間の空白と改行だけを変えます。2回整形しても結果が同じになる(冪等)ように作っています。
- 1行に圧縮されたコードを展開する用途に合わせています。行の長さに合わせてコードを組み直すPrettierのようなツールではありません。
- タブを選ぶとインデントがタブ文字に、スペースを選ぶとその数になります。ファイル保存時は言語に合った拡張子(.php .kt .sh …)が付きます。
よくある質問
入力したコードはサーバーに送信されますか?
いいえ。すべてブラウザ内で整形します。パスワードやキーが含まれるコードも安心して貼り付けられます。
Pythonの構造を整えてくれないのはなぜですか?
Pythonはインデントが文法のため、行を移動・結合するとプログラムの意味が変わります。タブ↔スペース変換と空白の整理のみ行います。
整形したらコードが壊れました。
文字列・コメントの中は変えないのが原則ですが、まれな構文で誤ることがあります。元のコードを保管して比較し、問題のコードを教えてください。
「HTMLとしてコピー」は何に使いますか?
ブログ・Wiki・メールなど、コードハイライト機能のない場所に色付きのコードを貼るときに使います。スタイルがタグ内にあるため別途CSSは不要です。
このツールの使い方
インデントが乱れたコードを読みやすく整えるときに使います。HTML・CSS・JavaScript・JSON・PHP・Java・Kotlin・Shell・Python・SQL・XML・YAMLをタブまたはスペース(2・4・8個)で整え、コピーするか色付きHTMLで書き出せます。コードはサーバーに送信されません。
よくある質問
どの言語を整形できますか?
HTML・CSS・JavaScript・JSON・PHP・Java・Kotlin・Shell・Python・SQL・XML・YAMLに対応しています。
インデントを選べますか?
はい。タブまたはスペース2・4・8個から選べます。
コードはサーバーに送信されますか?
いいえ。コードはサーバーに送らず、ブラウザで整形します。
関連ツール
すべてのツールを見る開発者ツール
URL・Base64・HTML・Unicodeエンコード、JSON整形・CSV変換、UNIX時間、JWTデコーダー、ハッシュ、UUID、正規表現、テキスト比較、進数変換、cron解釈、表の変換、サブネット(CIDR)・chmod計算、HTTP・MIME・ポート辞典、robots・sitemap、ダミーデータ、TOTP・semver・ビット演算・設定ファイル(.env・INI・TOML)変換・JSON スキーマ検証・docker run→compose・.gitignore・OG タグ生成・ASCII/ANSI コード表まで、40種の開発補助ツールを1か所に。
コード圧縮(Minify)
HTML・CSS・JS・JSONのコメントと不要な空白を取り除いて容量を減らします。貼り付けやファイルを開く(ドラッグ&ドロップ可)ことができ、結果のコピーや.minファイルのダウンロードも可能です。コードはサーバーに送信しません。
JSON・XML・YAMLパーサー
JSON・XML・YAMLを貼り付けるかファイルで開くと、文法チェック(誤りは何行目何文字目か)、折りたたみ式のツリー表示、値・キーの検索、パスによる値の検索、整形・圧縮、相互変換ができます。処理はすべてこのブラウザ内で行われ、入力やファイルはサーバーに送信されません。
CSS ジェネレーター
グラデーション・影(box/text-shadow)・角丸(border-radius)・flex/grid レイアウトを見ながら作って CSS をコピーします。入力はサーバーに送信されません。
パスワード生成
長さと文字の種類を選んで、または覚えやすい単語の組み合わせ(パスフレーズ)で、推測されにくいパスワードを作ります。作った値はこの画面の外には出ません。
IPアドレス確認
現在接続しているグローバルIPアドレスとおおよその位置を確認します。