OpenAI has released Euphony, an open-source, browser-based visualization tool designed to simplify the debugging of complex AI agent workflows. As AI agents increasingly perform multi-step tasks—such as reading files, calling APIs, and writing code—developers have struggled to interpret the resulting raw JSON logs. Euphony addresses this by transforming structured Harmony conversation data and Codex session logs into readable, interactive timelines, eliminating the need for manual parsing of deeply nested JSON objects.
Streamlining Complex Data Formats
Euphony is engineered to handle OpenAI’s specialized data structures, specifically the Harmony response format used by the gpt-oss model series and Codex session JSONL files. Unlike standard chat formats, the Harmony format supports multi-channel outputs, including reasoning, tool-calling preambles, and role-based instruction hierarchies. By ingesting these files via clipboard, local disk, or public HTTP(S) URLs, Euphony automatically detects the format and renders the information into a browseable interface.
The tool offers a robust feature set for data inspection, including a dedicated metadata panel for viewing conversation-level and message-level details. Developers can utilize JMESPath-based filtering to query large datasets, while a focus mode allows for the filtering of messages by role, recipient, or content type. Additionally, the tool supports Markdown and mathematical formula rendering, along with an in-browser editor mode for modifying JSONL content directly.
Flexible Deployment and Integration
The architecture of Euphony provides two distinct operating modes to suit different development environments. A frontend-only mode allows the application to run entirely within the browser without server dependencies, while a backend-assisted mode utilizes a local FastAPI Python server to facilitate the loading of larger datasets and remote files. OpenAI notes that the backend-assisted mode is intended for local use and should not be exposed externally due to potential security risks.
For teams looking to integrate these visualization capabilities into their own platforms, Euphony ships as a set of reusable Web Components. These custom elements can be embedded into projects built with React, Svelte, Vue, or plain HTML. Developers can drop a custom conversation element into their UI and customize the visual styling, such as font colors and role-specific coding, using CSS custom properties. Built primarily with TypeScript, the project is available under the Apache 2.0 license.

Comments (0)
to join the discussion
No comments yet
Be the first to share your thoughts!