Improve running cell UX and auto-scroll streaming output

[axsseldz]

📝 Summary

Improve UX for running cells by making the active cell easier to identify and automatically following streaming output.

🔍 Changes

• use a more native marimo accent color for the running cell highlight
• improve visibility of the running state with a clearer Running status pill
• auto-scroll output to show the latest content while a cell is running
• pause auto-scroll when the user scrolls up, and resume when they return to the bottom

Before

• running cells were difficult to distinguish from idle cells
• users had to rely on a small timer to detect activity
• streaming output did not automatically follow new lines

After

• running cells are easier to identify at a glance
• running state feels more consistent with marimo UI
• output automatically follows new content during execution
• users can scroll up without losing control of the view

💬 Discussion

This PR is meant as a lightweight UX proposal to explore how running cells could be more clearly communicated without introducing major visual changes. The intention is to start a conversation and gather feedback on whether this direction feels natural within marimo’s design.

Open to suggestions on:

• how strong or subtle the running indicator should be
• whether the auto-scroll behavior feels intuitive
• alternative ideas that could better communicate active execution

📋 Checklist

• I have read the contributor guidelines.
• For large changes, or changes that affect the public API: this change was discussed or approved through an issue, on Discord, or the community discussions (Please provide a link if applicable).
• Tests have been added for the changes made.
• Documentation has been updated where applicable, including docstrings for API changes.
• Pull request title is a good summary of the changes - it will be used in the release notes.

@mscolnick @nojaf

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
marimo-docs	Ready	Preview, Comment	Apr 3, 2026 1:31pm

[Copilot]

Pull request overview

Improves the notebook editing experience by making running cells more visually identifiable and by automatically keeping streaming console output scrolled to the latest content during execution.

Changes:

• Add a running-state visual treatment for cells and a clearer “Running” status pill.
• Add auto-follow behavior for streaming console output while a cell is running (with user scroll override).
• Update/extend frontend tests and snapshots; minor cleanup in a Plotly example.

Reviewed changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
frontend/src/css/app/Cell.css	Adds running-cell highlight styles/animation.
frontend/src/components/editor/cell/cell-status.css	Styles the running “pill” + pulse indicator.
frontend/src/components/editor/cell/CellStatus.tsx	Adds “Running” label next to the timer.
frontend/src/components/editor/notebook-cell.tsx	Applies running class to cells and passes running into ConsoleOutput.
frontend/src/components/editor/output/console/ConsoleOutput.tsx	Implements conditional auto-scroll-follow for streaming output while running.
frontend/src/components/editor/output/console/tests/ConsoleOutput.test.tsx	Adds tests around the new auto-scroll behavior.
frontend/src/components/editor/renderers/vertical-layout/vertical-layout.tsx	Passes the new running prop (currently hard-coded false).
frontend/src/components/scratchpad/scratchpad.tsx	Passes running state into ConsoleOutput for scratchpad.
frontend/src/tests/snapshots/CellStatus.test.tsx.snap	Updates snapshot for the new running label.
examples/third_party/plotly/histogram.py	Removes a stray line artifact.

[mscolnick]

thanks for sharing this design. i quite like the idea of a stronger indicator. if its ok with you, ill see if we can bring a designer in to iterate on the exact design for this.

[axsseldz]

thanks for sharing this design. i quite like the idea of a stronger indicator. if its ok with you, ill see if we can bring a designer in to iterate on the exact design for this.

That'd be greeat!