Spreadsheet MCP App

A streaming spreadsheet MCP App built with Skybridge. Claude renders interactive spreadsheets in real-time — cells appear with animations as the model streams its response.

Features:

• Streaming — cells render progressively as the model types

• Sparse addressing — only populated cells are sent, gaps are automatic

• Auto-sizing columns — widths adjust to content

• Resizable columns — drag column borders to resize

• Fullscreen mode — expand to fill the viewport with sticky headers and infinite scroll

• Dark mode — respects system theme

• Links — URLs and emails are auto-detected and clickable

Prerequisites

Node.js (v22+)

• macOS: brew install node

• Linux / other: nodejs.org/en/download

cloudflared (for tunneling to Claude)

• macOS: brew install cloudflared

• Linux / other: developers.cloudflare.com/cloudflare-one/connections/connect-networks/downloads

Setup

1. Install dependencies

2. Start the dev server

The server runs at http://localhost:3000. Skybridge DevTools are available at http://localhost:3000 for local testing without Claude.

Connecting to Claude

Tunnel your local server with cloudflared to get a public URL:

Then add your tunnel URL with /mcp appended (e.g. https://xxx.trycloudflare.com/mcp) as a remote MCP server in Claude settings.

Tool: spreadsheet

The server exposes a single tool that Claude uses to render spreadsheets.

Input format: CSV string with columns cell,value,style — one row per cell.

Example input:

Try it: Ask Claude something like "Make a spreadsheet comparing Q1-Q4 revenue for 3 product lines".

Project Structure

Production Build

Built With

• Skybridge — full-stack framework for MCP Apps

• MCP Apps (ext-apps) — open standard for interactive UI in MCP