A trading desk in one page. The chart draws candles with moving averages and volume, has a crosshair and switches interval. The order book flashes as prices move, the ticket takes buy and sell orders and says why it can’t submit, and there is a portfolio, a watchlist and a trades table. The prices are simulated, not live: store.ts is the only file that knows where numbers come from, so you point it at your exchange API and the UI follows. With Reduce Motion on, numbers don’t count and candles don’t stagger in.
- Candles, moving averages and volume
- Order book that flashes on each move
- Buy/sell ticket with clear errors
- Portfolio, watchlist and trades table
- Stack
- React + TypeScript, Tailwind CSS, Framer Motion
- Next.js
- App Router ready, "use client" included
- Also included
- A single HTML file version and PROMPT.md
- Licence
- MIT
Props
- OrderBook, Ticket
- use the panels on their own
- Portfolio, Watchlist, Trades
- side panels
- ChartCard
- candles + volume
Questions
Does the dashboard work in Next.js?
Yes, as a client component. Keep "use client" at the top of the file that renders it, as in the snippet above. App Router and Pages Router both work.
Are the prices live?
No, they're simulated. Feed it your market data.
Is it really free?
Yes. MIT licence, no email needed for the registry install.
Can Cursor or v0 add it for me?
Yes. The folder has a PROMPT.md. Paste it into Cursor, Lovable, v0 or Claude Code.