AI Chat Heatmap Web App

A web application to visualize your ChatGPT and Claude conversation activity as a calendar heatmap.

Features

• Upload ChatGPT and/or Claude conversation exports (conversations.json)
• Side-by-side color-coded heatmap: green for ChatGPT, orange for Claude, gradient for days with both
• Select your preferred time zone for accurate date mapping
• Light/Dark mode toggle
• Modern UI built with shadcn/ui and Tailwind CSS
• Fully client-side: no data leaves your browser

Getting Started

Prerequisites: Bun

git clone https://github.com/cr2007/chatgpt-heatmap-web.git
cd chatgpt-heatmap-web

bun install   # Install dependencies
bun --bun dev # Start the dev server

The app is available at http://localhost:3000.

To run the test suite:

bun test

Usage

ChatGPT

1. Go to chatgpt.com > Profile > Settings > Data Controls > Export Data
2. Download and unzip the archive
3. Upload the conversations.json file

Claude

1. Go to claude.ai > Settings > Export Data
2. Download and unzip the archive
3. Upload the conversations.json file

You can upload one or both files. The heatmap updates automatically after each upload.

Self-Hosting

Option 1: Pre-built image from GitHub Container Registry

docker run -d -p 3000:3000 ghcr.io/cr2007/chatgpt-heatmap-web:latest

Option 2: Build locally

git clone https://github.com/cr2007/chatgpt-heatmap-web.git
cd chatgpt-heatmap-web

docker build -t chatgpt-heatmap .
docker run -d -p 3000:3000 chatgpt-heatmap

The application is available at http://localhost:3000.