画像インスペクター – サイズ・形式・data URIを確認
画像インスペクターは画像をブラウザ上で読み込み、実際の寸法、MIMEタイプ、ファイルサイズをライブプレビューとともに表示します。また、画像の埋め込み可能なdata: URIも提供します。画像を貼り付けまたはドロップして検査し、必要なものをコピーしてください。アップロードは一切行われないため、ピクセル寸法の確認や、画像をサーバーに送信せずにdata URIを取得するのに便利です。
画像インスペクターは、画像の実際の寸法、MIMEタイプ、ファイルサイズを確認するブラウザベースの画像インスペクターです。ライブプレビューと画像の埋め込み可能なdata: URIを表示するため、他のツールを開かずに画像プロパティを検査しやすくなっています。画像を貼り付けまたはドロップして始めましょう。
ツールはブラウザ上で画像を読み込み、プレビューとともにプロパティを報告します。実際の寸法は画像のピクセルサイズを示し、MIMEタイプはメディアタイプを特定し、ファイルサイズは画像のデータ量を報告します。表示されるdata: URIは画像の埋め込み可能な表現です。説明されているワークフローは変換ではなく検査に焦点を当てており、設定可能なオプションはありません。
画像ファイルはプレビューで視覚的に検査でき、寸法、MIMEタイプ、ファイルサイズなどの詳細は画像を見ただけではわからない情報を提供します。data: URIは、埋め込み用に画像をURIで表現したい場合に便利です。これらの詳細は、開発者がコードで使う前に画像をチェックしたり、実際のピクセル寸法を確認したりするのに役立ちます。
画像インスペクターは完全にブラウザ上で動作します。画像はお使いのデバイスで処理され、サーバーへのアップロードや送信は行われません。ページの読み込み後はサーバー接続なしでオフライン動作します。そのため、画像をプライベートに検査してdata: URIをコピーできます。
開発者やDevOpsエンジニアは、このツールで画像のプレビュー、プロパティの確認、data: URIの取得ができます。個別の画像検査ツールをインストールせずに、プロジェクトで使う前に画像をチェックしたい方にも役立ちます。
手順1: 画像インスペクターに画像を貼り付けまたはドロップします。ツールがブラウザ上で画像を読み込み、検査可能にします。
手順2: ライブ画像プレビューを確認します。確認したい画像が正しく表示されているか確かめられます。
手順3: 報告される実際の寸法、MIMEタイプ、ファイルサイズを確認します。これらの詳細は読み込まれた画像の情報です。
手順4: 埋め込み可能なdata: URIなど、必要なものをコピーします。画像をURIとして表現したい場合に使いましょう。
用途: プロジェクトに追加する前に、誰かから送られた画像を確認します。プレビューと報告されるプロパティで、受け取った内容を検証できます。
用途: ページやアプリケーションで使う前に、画像の実際のピクセル寸法を確認します。作業の基準となる実際の寸法がわかります。
用途: どんな種類の画像ファイルかを調べる際に、画像のMIMEタイプを確認します。インスペクターはプレビューとともにタイプを報告します。
用途: 特定の用途に適しているか判断する前に、画像のファイルサイズを確認します。報告されるサイズで情報がすぐにわかります。
用途: 画像の埋め込み可能なdata: URIを取得します。インスペクターがURIを表示するので、必要なものをコピーできます。
用途: サーバーにアップロードせずに画像をプレビューして詳細を確認します。ブラウザ上でプライベートに画像を検査したい場合に便利です。