An elite cryptocurrency trading dashboard prototype built with React and Tailwind CSS.
This repository is a frontend / UI–UX showcase. All market data, AI outputs, and alerts are high-fidelity mock data for demonstration—no live trading backend is connected.
- Live ticker tape — Horizontally scrollable symbol strip with interactive selection (demo quotes).
- Pro charting — Plotly-powered line and candlestick views, compare mode, and a time-machine style slider over mock series.
- AI swarm panel UI — Multi-role narrative layout with confidence and reasoning copy (simulated agent run).
- Market sentiment heatmap — Dense cross-asset sentiment grid for dashboard context.
- Trade history UI — Scrollable audit-style table of mock signals and summaries.
- Whale alerts — Animated feed of simulated large-flow cards.
- Polished shell — Sticky nav, command palette entry point, draggable dashboard tiles, and responsive layout patterns.
| Layer | Tools |
|---|---|
| UI | React · Vite · TypeScript |
| Styling | Tailwind CSS |
| Icons | Lucide React |
| Charts | Plotly.js · react-plotly.js |
npm installnpm run devOpen the URL shown in the terminal (typically http://localhost:5173).
Other scripts: npm run build (production bundle) · npm run preview (preview build) · npm run lint
src/
├── components/ # UI: charts, navbar, ticker, panels, widgets, loaders, …
├── pages/ # Route-level views (e.g. Dashboard)
├── hooks/ # React hooks (dashboard state, helpers)
├── utils/ # Client helpers (e.g. time slicing, audio)
├── constants/ # Shared constants (symbols, etc.)
├── api/ # Stubs / future API wiring
├── App.tsx
├── main.tsx
└── index.css
| GitHub | aliza-dev |
| Aliza Tariq | |
| [email protected] |
TradePilot AI — UI/UX demo · Aliza Tariq