Source Viewer
What the Source Viewer does: a code editor with syntax highlighting for 100+ languages, URL loading, HTML-to-Markdown, and beautify — your starting point.
View, highlight, and edit source code
The Source Viewer is a full code editor in the browser. You paste source code, open a file from disk, or pull in the source of a remote URL — and get it shown instantly with syntax highlighting for over 100 languages: from HTML, CSS, JavaScript, PHP, and Python through YAML, SQL, and Dockerfile to Rust, Go, Swift, and Kotlin. Line numbers, code folding, find-and-replace, and a dark editor theme are there from the start.
So it is more than a plain viewer: you can edit the code directly, format it with the built-in beautifier for JavaScript, CSS, and HTML, turn HTML into clean Markdown or plain text, and preview Markdown live as HTML. Everything runs in the browser, with no account and no installation; the editor auto-saves your work to local browser storage and restores it on your next visit.
The tool is built for everyone who needs to get at code quickly: developers who want to inspect the source of a live page or tidy up a snippet; content and SEO people who convert HTML to Markdown or check a URL's meta data; and anyone who just needs a decent editor with highlighting without firing up an IDE.
In the live tool the editor is simply named "Source" (title: "Source: Code Editor with Syntax Highlighting"). The interface is in English throughout — this documentation therefore refers to button and menu labels in their original English spelling.
What the Source Viewer can do — at a glance
The features group into four areas:
- Editor & highlighting — the editor is built on the ACE Editor and brings its full feature set: syntax highlighting for 100+ languages (language selector top right), line numbers, code folding, multiple cursors, autocomplete, syntax checking (linting), find/replace, go-to-line, and a dark theme (Dracula, alternatively Monokai).
- Load content — three ways: paste/type code, open a local file (HTML5 File API), or load the source of a URL (via the JPKCom proxy, see below). Saving as a file and a "Clear" to empty the editor are included.
- Convert — Beautify (format code via JS Beautifier), HTML → Markdown (including auto-generated YAML frontmatter from the meta data), HTML → plain text, and a Markdown/text preview that renders the result as HTML and highlights code blocks.
- URL analysis — beyond the plain source, the tool can load an SEO evaluation (meta data, headings, links, images) and a connection analysis (HTTP headers, SSL certificate, timing) for a URL as a Markdown report into the editor.
On top of that come convenience functions: change font size, toggle line wrap, fullscreen mode, print, a keyboard-shortcuts overview, and a settings dialog (tab size, theme, visible whitespace, indent guides, line numbers, autocomplete, linting).
Server-side fetch, highlighting in the browser
When you load a URL, that is a deliberate hybrid — just like the SEO & GEO Analyzer: the remote page is fetched server-side via the JPKCom proxy (a direct fetch from your browser would otherwise fail on CORS). The syntax highlighting, conversion, and preview then happen locally in your browser.
For privacy that means: the loaded page sees a request from the JPKCom server, not your IP address. The proxy is hardened against abuse — it blocks internal and private addresses (SSRF protection), allows only HTTP/HTTPS, and caps the size and runtime of each fetch. How exactly this works and what limits apply is covered in the manual. What you cannot load by URL: pages behind a login, local dev instances, or intranet addresses.
Try it now
→ Open the Source Viewer — paste code or load a URL, pick a language, done. No account, free, right in the browser.
Related JPKCom tools
- SEO & GEO Analyzer — uses the same server-side proxy and has its own Source Code tab running the same ACE editor; the direct relative when it comes to analyzing a URL.
- Beautify — the specialized formatter for JavaScript, CSS, and HTML (the same JS Beautifier engine), including deobfuscation.
- Compiler — compile SASS/SCSS to CSS, and minify and beautify HTML, JavaScript, and CSS.
- Playground — run HTML/CSS/JavaScript live in the browser instead of just viewing it.
- Markdown Editor — for when you want to keep writing the result you got from HTML-to-Markdown.
There's more on the subpages: the manual with every feature and the proxy architecture in detail, hands-on examples, and a collection of tips & tricks.