CCStatusline Editor

English | 简体中文

A visual editor for building ccstatusline configurations — drag, drop, preview, ship.

Try it online →

What it does

This is a browser-based editor for ccstatusline, the status line tool for Claude Code. Compose your status line here and see exactly what your terminal will render — no local install, no Nerd Font required just to preview.

• True-to-terminal preview — 256-color / truecolor and powerline arrows are drawn as SVG in the browser, matching what your terminal will actually show.
• Point-and-click widgets — git status, model, context usage, quota countdowns, custom text, and more, all configured through the UI.
• Templates — ready-made status lines you can apply in one click, then tweak.
• Share links — send a link that reopens the editor with your exact config loaded.
• Round-trip editing — apply a config from the editor via the companion @refinist/ccsa CLI, pull it back later with @refinist/ccsa export, and keep refining.
• Theme rotation — build a pool of themes and have your status line switch between them automatically on a schedule (hourly / daily / weekly / a custom interval), or pin a fixed look to each weekday. Cycle in order or shuffle at random, then export the pool as a bundle the @refinist/ccsa CLI runs with rotate on. See ccsa-rotation-rainbow-week.json for a ready-to-run sample — a seven-theme "rainbow week" that rotates a fresh gradient and a per-weekday mood line every day.
• i18n — English, 简体中文, 繁體中文.

Getting started

pnpm install
# frontend dev server (http://localhost:3173)
pnpm dev

The share feature (/api/share) is backed by a Cloudflare Worker + KV. To exercise it locally, also run:

# Worker + local KV emulation (http://localhost:8787)
pnpm worker:dev

pnpm dev proxies /api/* to :8787, so running both together gives you frontend hot-reload with a working share flow.

# type-check + production build
pnpm build
# eslint
pnpm lint
# vitest
pnpm test

Related projects

• sirmalloc/ccstatusline — the status line renderer this editor targets.
• refinist/ccstatusline-apply — @refinist/ccsa, the companion CLI that writes a config generated here to ~/.config/ccstatusline/settings.json on your machine.

License

MIT

Copyright (c) 2026-present, REFINIST