Browser Extension · v

View source code
the way it should be

Stop squinting at plain, unstyled browser source. Source Code Viewer brings syntax highlighting and clean formatting to every page (HTML, CSS, JS, JSON & XML) plus a built-in font viewer, right from the context menu.

Add to Chrome

Add to Firefox View on GitHub

● Free & Open Source ● ●

view-source: example.com/index.html

1<!DOCTYPE html>
2<html lang="en">
3<head>
4  <meta charset="UTF-8">
5  <title>Example</title>
6</head>
7<body class="dark-theme">
8  <!-- Main Content -->
9  <div id="app">
10    <h1>Hello World</h1>
11  </div>
12</body>
13</html>

// screenshots & demo

See it in action

Watch the extension transform raw browser source into beautifully highlighted, readable code, and preview web fonts, glyph by glyph.

// Interactive walkthrough: features, site tree, themes & search

Source Code Viewer formatting a JSON document in dark mode with line numbers and code folding

// JSON formatting, syntax highlighting, line numbers & code folding

Source Code Viewer showing HTML source code with the interactive reference sidebar and virtual site tree

// Interactive reference sidebar: explore external scripts, stylesheets & assets

Source Code Viewer with structural search panel open supporting CSS Selectors, XPath, and regex

// Targeted search: full-text, CSS Selectors, XPath & JSONPath

Built-in Font Viewer displaying the complete character glyph grid with one-click copy

// Font viewer: complete glyph grid with one-click copy

Built-in Font Viewer testing custom sample text with interactive size, weight, and style controls

// Font viewer: live typing preview, size, weight & style controls

Extension settings page configuring default themes, font size, word wrap, and opening behavior

// Configurable settings: themes, font size, word wrap & tab behavior

// More details available on the Chrome Web Store or Firefox Add-ons ↗

// features

Everything a dev
actually needs

Built for developers who spend time reading source code. No bloat, no tracking, no nonsense.

🎨

Syntax Highlighting

Automatic language detection with beautiful, readable colorization for HTML, CSS, JavaScript, JSON and XML.

📐

Auto Formatting

Minified or unformatted source gets automatically indented and structured, even when you open a raw file directly.

🔍

Advanced Search

Hit Cmd/Ctrl+F to search the whole file with full-text options, or use advanced structural search modes: XPath, CSS Selectors, and JSONPath.

⬇️

Download Source

Save the formatted source in one click, with the right filename. HTML pages still render locally and stylesheets keep finding their assets.

🔤

Font Viewer

Open a web font (woff2, woff, ttf, otf) to preview it with your own text, size, weight and style, plus a glyph grid you can copy from.

🌈

Themes & Readability

Dozens of light and dark themes, with word wrap, line numbers and code folding for comfortable reading.

🔗

Clickable Links

Jump between resources without leaving the viewer: links are routed by type, and images open in the browser.

🖱️

Instant Access

Right-click "View Source" or click the toolbar icon to open the formatted viewer. No extra steps.

// how it works

Three ways to
view source

Simple, fast, and always available: exactly where you expect it.

Install the extension

Add Source Code Viewer from the Chrome Web Store or Firefox Add-ons. One click, no setup required.

Open any page

Navigate to any website. Right-click anywhere on the page and choose "View Page Source" from the context menu.

Read beautiful code

Source Code Viewer opens the page source with full syntax highlighting and clean formatting.

version

extension size

languages

9 locales

license

View source codethe way it should be