A single-file local image/video viewer and converter with HEIC, PDF, and ICO support — built for browsing and converting iPhone photo exports.
HEIC etc Viewer is a single HTML file that runs entirely in your browser. No data is sent to any server — all file processing happens locally between your browser and your local storage. This means it works equally well whether hosted on the web or run locally. Supports HEIC/HEIF, JPEG, PNG, WebP, GIF, AVIF, SVG, BMP, TIFF, MP4, WebM, MOV, PDF, and ICO. Folder navigation is provided via a tree panel. Key features include thumbnail caching, a lightbox viewer with drag-to-select zoom, checkerboard background for transparent images, video loop, and slideshow mode. Static images (HEIC/HEIF, JPEG, PNG, WebP, BMP, TIFF, AVIF) can also be converted and saved as WebP, PNG, JPEG, or PDF — one file at a time, or in bulk as a zip.
Built as a single HTML file with no build tools or package dependencies.
- Vanilla HTML / CSS / JavaScript — no frameworks
- libheif.js — HEIC/HEIF decoding via WebAssembly, loaded from CDN
- PDF.js — PDF thumbnail rendering via WebAssembly, loaded from CDN
- jsPDF — PDF generation for the convert-to-PDF feature, loaded from CDN
- client-zip — zip generation for bulk conversion downloads, loaded from CDN
- Canvas API — thumbnail generation for video frames and zoom region rendering, and image re-encoding for the convert feature
- File System API (
webkitdirectory,DataTransferItem.webkitGetAsEntry) — local folder access and directory tree traversal
The easiest way is to open the hosted version on GitHub Pages:
https://securecat.github.io/heic-etc-viewer/
Your files never leave your device.
Alternatively, download heic-etc-viewer.html and open it directly in Chrome.
Opening via file:// disables folder drag & drop due to browser security restrictions. To enable it, run a local server in the same folder:
npx serve .
# or
python -m http.server 8080
Then open http://localhost:3000/heic-etc-viewer.html in Chrome.
- Video thumbnail generation (gallery grid and the "Thumbnail"/"Thumbnails" conversion) now tries a few points through the video instead of only the 10%-mark, skipping ones that look like a near-solid-color frame (fade-in/out, intro card) when a more detailed frame is available
- The "Thumbnail"/"Thumbnails" download now reuses the frame already captured for the gallery grid instead of re-decoding the video from scratch
- Hovering the selected folder in the tree now shows a distinct color (
#8AB2FFtext on#1B375Ebackground) instead of the same color as a non-selected row - The "Open Folder" button's hover background is now
#2D4EC1, also applied while pressed (previously identical to its resting color, so hovering had no visible effect)
- Switching from a folder scrolled partway down to another folder with enough files to scroll no longer starts the new gallery at the previous scroll position; it now always starts at the top (grid layout only scrolled back to top on a resize-triggered relayout, never on an actual folder switch)
See CHANGELOG.md for full history.
HEIC、PDF、ICOに対応した、単一ファイルで動作するローカル画像・動画ビューアー&コンバーター。iPhoneから書き出した写真の閲覧・変換に最適化されています。
「HEIC etc Viewer」は、ブラウザ上で完全に動作する単一のHTMLファイルです。データがサーバーに送信されることはなく、すべてのファイル処理はブラウザとローカルストレージの間で完結します。そのため、Web上でホストする場合でもローカルで実行する場合でも、同様に利用可能です。 対応形式は、HEIC/HEIF、JPEG、PNG、WebP、GIF、AVIF、SVG、BMP、TIFF、MP4、WebM、MOV、PDF、ICOです。フォルダの移動は、ツリーパネルで行えます。主な機能として、サムネイルのキャッシュ、ドラッグ操作でズーム範囲を選択できるライトボックスビューア、透過画像用の市松模様の背景表示、動画のループ再生、スライドショーモードなどを備えています。静止画(HEIC/HEIF、JPEG、PNG、WebP、BMP、TIFF、AVIF)はWebP・PNG・JPEG・PDFに変換して保存することもでき、1ファイルずつでも、まとめてzipでも保存できます。
ビルドツールやパッケージの依存関係を使用せず、単一のHTMLファイルとして構築されています。
- Vanilla HTML / CSS / JavaScript — フレームワーク不使用
- libheif.js — WebAssemblyによるHEIC/HEIFデコード(CDNから読み込み)
- PDF.js — WebAssemblyによるPDFサムネイルのレンダリング(CDNから読み込み)
- jsPDF — PDF変換保存機能のPDF生成(CDNから読み込み)
- client-zip — 一括変換ダウンロード時のzip生成(CDNから読み込み)
- Canvas API — 動画フレームのサムネイル生成・ズーム領域のレンダリング・変換機能での画像再エンコード
- File System API (
webkitdirectory,DataTransferItem.webkitGetAsEntry) — ローカルフォルダへのアクセスおよびディレクトリツリーの走査
最も簡単な方法は、GitHub Pagesでホストされているバージョンを開くことです:
https://securecat.github.io/heic-etc-viewer/
サーバーへデータが送信されることはありません。ファイルの処理はすべて、ブラウザとローカルストレージの間でローカルに行われます。
あるいは、heic-etc-viewer.html をダウンロードし、Chrome で直接開いてください。
file:// 経由で開くと、ブラウザのセキュリティ制限により、フォルダのドラッグ&ドロップが無効になります。これを有効にするには、同じフォルダ内でローカルサーバーを起動してください:
npx serve .
# または
python -m http.server 8080
ローカルサーバー起動後、Chromeで http://localhost:3000/heic-etc-viewer.html を開きます。
- 動画のサムネイル生成(ギャラリー一覧・「Thumbnail」/「Thumbnails」変換の両方)を、再生時間10%地点だけでなく数地点を試すように変更。より内容の分かる地点があれば、ほぼ単色(フェードイン/アウト、イントロ画面など)のフレームを避けて選ぶ
- 「Thumbnail」/「Thumbnails」のダウンロードは、ギャラリー表示用に生成済みのフレームを再利用するように変更(動画の再デコードなし)
- ツリーで選択済みのフォルダにカーソルを重ねた時の色を、非選択行と同じ色ではなく専用の配色(背景
#1B375E、文字#8AB2FF)に変更 - 「Open Folder」ボタンのhover時の背景色を
#2D4EC1に変更。押下時も同色を維持(これまでは通常時と同じ色でhoverしても見た目の変化がなかった)
- スクロールした状態のフォルダから、スクロールが発生するほど内容の多い別のフォルダへ移動した際、新しいギャラリーが前のフォルダのスクロール位置のまま表示されてしまう問題を修正。常に先頭から表示されるように(グリッドレイアウトでは、リサイズ時の再レイアウトでしか先頭に戻しておらず、フォルダ切り替え時には戻していなかった)
全履歴は CHANGELOG.md を参照。