Syntax Highlighter / 機能

読み手に伝わるコード例を作成。

コードを貼り付けるかファイルを読み込み、言語とテーマを選びます。変更はすぐにプレビューへ反映。行の効果を調整したら、ブラウザーから HTML や PNG を出力できます。

ソースコードの入力からファイルの保存まで、ひとつの画面で準備できます。

ソースコード

コードの貼り付け、UTF-8 ファイルの読み込み、言語別サンプルの読み込みに対応。

言語、別名、テーマを検索できます。テーマはライト・ダークで絞り込めます。

強調、フォーカス、追加行、削除行ごとに範囲・色・不透明度を設定できます。

変更をすぐに確認し、出力に使われる JSON 設定を参照できます。

インラインスタイル、別ファイルの CSS、Tailwind CSS 形式の HTML をコピー・保存できます。

PNG 保存のほか、行番号の設定、区間の折りたたみ、URL のリンク化ができます。

デモで行の強調、フォーカス、追加・削除行、折りたたみ、行番号を試せます。プレビューとダウンロードには同じ設定が適用されます。