Linux Image Rendering Fix
approvedby evgene-kopylov
This plugin has not been manually reviewed by Obsidian staff. Fixes image rendering issues on Linux. Ensures images display correctly on Ubuntu and other Linux distributions.
Linux Image Rendering Fix
Obsidian plugin that fixes image rendering issues on Linux (Ubuntu).
Problem
On Linux, especially Ubuntu and derivatives (Pop!_OS, Linux Mint, etc.), Obsidian (an Electron/Chromium app) often fails to display local images. The issue has been reported since 2022 (v1.0.0) and remains unfixed.
The root cause is twofold:
- Broken
app://protocol — Electron/Chromium cannot resolve paths with non-ASCII characters: emoji, diacritics, Cyrillic, CJK, etc. - Missing image codecs — some Linux Electron builds lack codecs for PNG, JPEG, WebP, causing status 0 or decode failures.
Affects Snap, Flatpak, and DEB packages. AppImage is slightly more stable but not immune. ARM systems also affected.
This is an upstream Electron/Chromium bug. The Obsidian team cannot fix it directly. This plugin provides a reliable workaround.
How it works
The plugin intercepts markdown rendering (MarkdownPostProcessor), finds all <img>
elements, reads the image file directly from disk via vault.adapter.readBinary()
and replaces src with a Blob URL (blob:...). This bypasses the broken app:// protocol.
Features
- Loads images bypassing the
app://protocol - Supports png, jpg, gif, webp, svg, bmp
- Automatic processing when opening a page
- Reprocess images command for manual refresh
Installation
Symlink (recommended for development)
ln -s "$PWD" /home/death/Documents/TEST-VAULT-3/.obsidian/plugins/linux-image-rendering-fix
After npm run build, Obsidian picks up the new main.js on plugin reload.
Copy files
Copy main.js, manifest.json, styles.css to the plugin directory:
<Vault>/.obsidian/plugins/linux-image-rendering-fix/
Issues
Bug reports and feature requests: https://github.com/Evgene-Kopylov/linux-image-rendering-fix/issues
Development
Development happens on GitLab: https://gitlab.com/Evgene-Kopylov/linux-image-rendering-fix
npm install
npm run dev # watch mode
npm run build # production build
npm run lint # ESLint
npm run test # Vitest
License
LGPL-3.0
For plugin developers
Search results and similarity scores are powered by semantic analysis of your plugin's README. If your plugin isn't appearing for searches you'd expect, try updating your README to clearly describe your plugin's purpose, features, and use cases.