devpreview.me
devpreview.me

Free for everyone

Raw files are unreadable.
They do not have to be.

devpreview.me turns JSON, XML, YAML, TOML, CSV, Markdown, CSS and JavaScript into something you can actually read — collapsible, searchable, syntax-coloured. A minified stylesheet or bundle gets pulled apart again. It finds the coordinates hidden in your data and draws them on a map that contacts nobody. No server, no account, no telemetry.

Free · Chrome · Safari 17 or newer on macOS 13

The everyday annoyance

You click an API response, a config file, a feed. Your browser shows you a wall of text with no structure, no colour and no way in.

So you copy it out, paste it into some online formatter, and hand a file you may not own to a server you do not know. This removes that step entirely — the file renders where it already is.

Try it right here

Pick a format, or paste your own file below. This is a stripped-down preview running in your browser — the extension does considerably more.

Without devpreview.me

      
With devpreview.me JSON
Paste your own

What makes it different

What the browser gives you

{"users":[{"id":1,"name":"Ada Lovelace","roles":["admin","dev"],"active":true}],"meta":{"page":1,"total":2}}

What you get

users: [ 0: { id: 1 name: Ada Lovelace roles: [admin, dev]

One line of JSON, readable

An API response arrives as a wall with no breaks. It becomes a tree you can collapse, search and copy from — where the file already is, with no upload and no detour through a formatter.

The shape, not the data

users[]array2 items
users[].idnumber2 distinct
users[].rolestring4 distinct
users[].seenstring1 null
meta.pagenumber1

The shape of the data, in one look

Which keys exist, how often, of which type — and where a field is sometimes missing or sometimes null. Click any type and every distinct value at that path appears, counted. Click the name and the path is on your clipboard.

One line, as it arrives

.card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:24px}

After

1.card { 2 background: #fff; 3 border: 1px solid #e2e8f0; 4 border-radius: 10px; 5 padding: 24px; 6}

Minified files, pulled apart

A bundled stylesheet or module arrives as one line with every gap removed. Breaks and indentation restored, coloured, every bracket foldable — and a click copies the piece that belongs together, not the word under the pointer.

A map that never phones home

Open a file with coordinates and you get a map — your points drawn over the outlines of every country on earth. Drag it, zoom it, watch the network inspector while you do: not one request leaves your machine. Every other viewer loads tiles from someone else's server, handing over your address and the region you are looking at, on every file you open.

And it finds coordinates that never said they were geo — a CSV with lat and lon, an API response with pickup_latitude, a config with "47.8130, 13.0450" in one string. Never on the name alone: latency is not a latitude, and where two fields could pair in more than one way, it pairs neither.

Nothing is ever uploaded The alternative is pasting an API response into a formatter on someone else’s server. No account, no analytics, no request to anyone but the host whose file you opened.
A hundred thousand nodes scroll like ten Only the visible rows are ever in the DOM. This is where every other viewer gives up, and it is the first thing you notice on a real file.
Works where the file actually lives Click “Raw” on a code host and you get a wall of text on a page locked down by a strict content policy — where most extensions do nothing at all. There the view is static rather than absent: colours and structure, just no clicking.
Detection by content, not filename A JSON API served as text/plain, a YAML file with no extension, a .txt that is really CSV. It reads the file, not the name.
Copy the path, not the value Click a field name and $.users[].role is on your clipboard, ready to paste into jq, a test, or the next request.
One search box, whatever you are looking at The tree, the schema and the raw source alike — with operators, and it opens every collapsed level above a match instead of leaving you to find it.
Every distinct value, counted Click a type in the schema and get each value at that path with how often it occurs. The outliers at the bottom are usually the point.
Arrays become a sortable table Rows and columns you sort by clicking a heading, with the count of distinct values per column in the header.
What a stylesheet says about itself Profile reads a CSS file back as a design system: colours by what they do, custom properties resolved, every font size with its measured contrast, the spacing and radius scales. Click a number and the real selectors appear.
What a JavaScript file offers API lists its classes, functions, values and listeners — and what each function hands back, which is the one thing no signature tells you.
Formats that know what they are RSS as a feed, a sitemap as a filterable list, OpenAPI as its endpoints, GeoJSON with geometry and property coverage.
CSV that Excel opens correctly The separator, the encoding, the line endings — and the = that Excel would otherwise execute.
Spot double HTML-encoding One switch between stored and resolved. If an & is still sitting there after resolving, two layers each thought they were first.
It leaves every other page alone Renders only on positive evidence. Everywhere else: no request, no restyling, not one DOM node touched — and where it cannot be sure, it shows you the source instead of a plausible guess.

The small things you notice on day two

Get devpreview.me

It is free. No licence key, no trial period, no account. Pick the browser you use and the store does the rest.

On macOS the extension arrives inside a small app: open it once, then switch devpreview.me on in Safari › Settings › Extensions. macOS 13 or newer, Safari 17 or newer.

In Chrome it installs straight from the store.

Ask us something

A format that other viewers choke on, a file that renders wrong, a question about what it does with your data — this is the way to us.

Your address is used to answer you and for nothing else. It is not stored here and passed on to nobody. How this works.