VS Code extension for viewing structured JSON log files (.log). Adds syntax highlighting, timestamp tooltips, and one-click JSON formatting.

Better Log Demo

Features

Syntax Highlighting

Automatically highlights key fields in JSON log lines:

@timestamp values are displayed in a distinct color for easy scanning
level values are color-coded by severity:

Level	Color
trace	gray
debug	light green
info	blue
warn	yellow
error	red
fatal	magenta

Timestamp Hover

Hover over an @timestamp value to see the local date and time (DD.MM.YYYY, HH:MM:SS) along with a relative time label (e.g. 5 min ago).

Open as JSON

JSON log lines have a { } Open as JSON CodeLens action. Click it to open the line as a formatted JSON document in a side panel. The tab is named after the timestamp of the entry for easy navigation between multiple open entries. Re-clicking the same line reuses the existing tab instead of opening a duplicate. Non-JSON lines do not show the CodeLens button.

When viewing a JSON preview tab, click the share icon in the editor title bar (or run Better Log: Share JSON as File from the Command Palette) to export the formatted JSON to a temporary file and reveal it in your system file manager. Useful for dragging the file into messengers or other apps that don't handle long pasted text well.

Source Line Highlighting

When you switch to a JSON tab opened from a log entry, the original line in the .log file is automatically highlighted and scrolled into view. This makes it easy to keep track of which entry you are inspecting when several JSON tabs are open side-by-side.

Toggle On/Off

You can enable or disable all Better Log features (highlighting, hover tooltips, code lenses) without uninstalling the extension:

Click the Better Log status bar item (visible when a .log file is open)
Or run the Better Log: Toggle command from the Command Palette

The current state is stored in the better-log.enabled setting.

Supported Log Format

The extension works with .log files where each line is a JSON object containing @timestamp and level fields:

{"@timestamp":"2026-04-04T12:00:00.000Z","level":"info","message":"Server started","port":3000}
{"@timestamp":"2026-04-04T12:00:01.123Z","level":"error","message":"Connection failed","host":"db.local"}

This format is compatible with ECS (Elastic Common Schema), Pino, Bunyan, and other structured logging libraries.

Installation

Search for better-log in the VS Code Extensions panel (Ctrl+Shift+X / Cmd+Shift+X) and click Install.

Better log