Source Viewer
What the Source Viewer does: a code editor for 100+ languages, URL loading, a sandboxed HTML live preview, beautify and minify, HTML to Markdown — start here.
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 see it 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. When you open or load something, the tool picks the language from the file name or URL path on its own. Line numbers, code folding, find-and-replace, and the dark Dracula theme are there from the start; light themes are one setting away.
So it is more than a plain viewer: you can edit the code directly, format it with the built-in beautifier or minify it, look at an HTML page in a sandboxed live preview, turn HTML into clean Markdown or plain text, extract a page's links, images, and scripts, and preview Markdown rendered. Everything runs in the browser, with no account and no installation; the editor auto-saves your work to local browser storage, restores it on your next visit, and keeps named snapshots when you want them.
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 called "Source" (page title: "Source: Code Viewer & Editor"). The interface is in English throughout, and this documentation uses the button and menu labels exactly as they appear there.
What the Source Viewer can do — at a glance
The features fall into five areas:
- Editor & highlighting — the editor is built on the ACE Editor (opens in a new tab) and brings its full feature set: syntax highlighting for 100+ languages (language selector in the toolbar), automatic language detection on load, line numbers, code folding, multiple cursors, autocomplete, syntax checking (linting), find/replace, go-to-line, a status bar with size and line count, and four themes (Dracula as the default, Monokai, plus the light GitHub and Solarized).
- Load and keep content — three ways in: paste/type code, open a local file (File menu or drag and drop), or load the source of a URL (via the JPKCom proxy, see below). The File menu bundles new, open, save (with a matching file extension), print, clear, and snapshots; recently loaded URLs sit in a history list. New content never overwrites code you have edited without asking first.
- Convert — Beautify (format code via JS Beautifier), Minify for HTML, CSS, JavaScript, and JSON, HTML → Markdown (with an auto-generated YAML frontmatter block from the meta data and links made absolute), and HTML → plain text.
- Preview & extract — an HTML live preview in a sandboxed frame with scripts switched off (optionally at tablet or phone width), a Markdown/text preview with highlighted code blocks and HTML export, and a dialog that lists links, images, scripts, stylesheets, and headings ready to copy.
- URL analysis — beyond the plain source, the tool can load an SEO evaluation (meta data, headings, links, images, score) and a connection analysis (HTTP headers, timing, SSL certificate including the chain — even for broken certificates) for a URL as a Markdown report into the editor.
On top of that come convenience features: font size, line wrap, fullscreen, shortcuts such as Ctrl+S and Ctrl+O, a toolbar you can drive with the arrow keys, a keyboard-shortcuts overview, and a settings dialog (font size, tab size, theme, invisible characters, indent guides, line numbers, active line, 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). Highlighting, formatting, conversion, preview, and extraction then happen locally in your browser. The HTML live preview does not run any of the loaded page's scripts.
For privacy that means: for the fetch itself, the loaded page sees a request from the JPKCom server, not your IP address. The preview is different: stylesheets, web fonts, and images in the HTML live preview and images in the Markdown preview are loaded by your browser directly from the respective servers — and those servers see your IP address. The proxy is hardened against abuse — it blocks internal and private addresses (SSRF protection, redirects included), allows only HTTP/HTTPS, caps the size (950 KB) and runtime of each fetch, and throttles the number of requests. 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, check the 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 and the same unpacker that never executes code).
- Compiler — compile SASS/SCSS to CSS, and minify and beautify HTML, JavaScript, and CSS; its HTML and CSS minifiers follow the same safety principles as the ones here but apply their own rules (the Compiler, for instance, also minifies
<style>blocks in HTML). - 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.