Screens

15 React app screens for AI products and SaaS.

Agent Chat – Chat with an orchestrating agent, the agents at work, and a brief to fill in beside it
Agent Run – One autonomous agent run: the plan ticking through its steps, the tool calls, an approval it waits on and the draft it wrote
Analytics – Revenue dashboard: key figures, revenue by channel, breakdown, top products and weekly trends
App Shell Flat – The App Shell laid flat – gray sidebar and an edge-to-edge page, split by a single hairline
App Shell Inset – Collapsible sidebar with workspace, menu, projects and account – the frame every screen sits in
App Shell Workspace Flat – The flat App Shell with a resizable work area on the right – sidebar, page and tools, each split by a hairline
App Shell Workspace Inset – App Shell Inset with a resizable work area on the right – tools, browser and suggested sources next to the page, like Claude or Codex
Assistant Home – AI assistant start page: greeting, prompt box with tools, connected apps and suggestions
CRM – Company list with pipelines, open views as tabs and an editable data table
Evals – Prompt evaluation dashboard: pass rate by version, reviewable prompt changes and test cases you can re-run
Folder – Inside one folder: breadcrumbs, file cards with previews, and an empty state
Folders – Folder overview with tabs, search, sort, grid/list toggle and file templates
Integrations – App directory with a sticky header, categories, search and connect states
Onboarding – First-run flow of an AI workspace: workspace setup, tool connections, team invites and a first agent, with a getting-started checklist
Settings & Billing – Settings page with tabs: workspace, members, API keys and billing with plan, usage, payment method, plan comparison and invoices