無料オンラインコードスクリーンショット作成ツール

エディタを開き、コードを貼り付けて言語を選びます。テーマ、ウィンドウフレーム、背景を選んだら、「PNGをダウンロード」をクリックします。画像はプレビューの2倍サイズのcode-screenshot.pngとしてデバイスに保存され、投稿やスライドにそのまま使えます。

29言語から選べます。TypeScript、JavaScript、Python、Rust、Go、Java、Kotlin、Swift、C、C++、C#、Ruby、PHP、HTML、CSS、SCSS、JSON、YAML、TOML、Bash、shell、SQL、GraphQL、Markdown、Dockerfile、Terraform、Vue、JSX、TSXです。リストには短いIDが表示されるため、C++はcpp、C#はcsharpと表示されます。

テーマは13種類です。ダークは10種で、Vitesse Dark、GitHub Dark、Dracula、Nord、One Dark Pro、Monokai、Catppuccin Mocha、Tokyo Night、Min Dark、Solarized Darkです。ライトは3種で、Vitesse Light、GitHub Light、Solarized Lightです。エディタの初期設定はVitesse Darkです。

現時点ではできません。エディタには「行番号を表示」のチェックボックスがありますが、まだ番号は追加されないため、PNGには行番号が入りません。読者に特定の行を示したい場合は、本文でその行を引用するか、コード内に短いコメントを追加してください。

PNGは、フレーム付きプレビューの縦横それぞれ2倍のサイズです。フレームは画面上で幅400 px以上あるため、ファイルの幅は800 px以上になります。行が長い、フォントが大きい、余白が広いほど、サイズは大きくなります。

カスタムカラーは使えますが、透明にはできません。単色9種かグラデーション4種から選ぶか、カラーピッカーで好きな単色を指定できます。ピッカーではグラデーションは作れず、透明のオプションもないため、ウィンドウの周りには必ず色が付きます。

macOSは赤、黄、緑のドットを表示します。Windowsは左にタブのタイトル、右に最小化・最大化・閉じるのマークを配置します。ブラウザは戻る・進むの矢印とアドレスバーが付きます。なしは、背景の上にコードだけを表示します。

いいえ、必要ありません。VS CodeやPyCharmなど、お使いのエディタからコードをコピーしてここに貼り付けてください。通常の画面キャプチャではタブやサイドバー、ご自身の配色設定まで写り込みますが、このツールは選んだテーマとフレームでコードの部分だけを描画します。

まず「言語」メニューを確認してください。このツールは言語を自動で推測しないため、PythonのコードをTypeScriptに設定すると、色が正しく付きません。コードに合った言語を選んでください。ハイライトに失敗した場合は、エラーメッセージではなく、単色のプレーンテキストとして表示されます。

サイズは変更できますが、書体は変更できません。スライダーの範囲は11〜20 pxです。コードにはお使いのデバイスに内蔵されている等幅フォントが使われるため、同じコードでもMacとWindowsで作成すると見た目が少し異なる場合があります。

はい、アカウント登録、透かし、1日の利用回数制限なしで無料でお使いいただけます。コードがサーバーに送信されることはなく、画像はお使いのデバイス上で描画・保存されます。公開サイトでは、Google Analyticsがページの訪問を記録しますが、コードは記録されません。