Notifications
Alex Morgan
alex@nexora.io
Good morning, Alex
Here is what is happening across your workspace today.
Revenue
Gross revenue vs. previous period
$128,430
▲ 12.4% vs prev.
Traffic sources
Sessions by channel, last 30 days
User growth
New signups per week
Conversion summary
Visitor → customer funnel health
Recent activity
Recent transactions
Latest payments across all customers
| Customer | Reference | Date | Method | Status | Amount |
|---|
Analytics
Mock analytics data — connect your own data source to go live.
Revenue trends
Current vs. previous period
Customer acquisition
New customers by channel
Active users
Daily active users (DAU)
Conversion funnel
From first visit to paying customer
All figures on this page are sample data defined in the central MOCK data object. Replace it with your API responses when integrating a backend.
Customers
Manage customer accounts, plans and subscription status. Changes are stored in memory only.
| Customer | Plan | Status | Joined | Last active | MRR | Actions |
|---|
No customers found
Try adjusting your search or filters.
Transactions
Payment history from the mock dataset. No real payment processor is connected.
| Reference | Customer | Date | Method | Status | Amount | Invoice |
|---|
No transactions match
Try a different search term or filter combination.
Plans & billing
Interface demonstration only — no real billing is processed. Edit pricing centrally in the PLANS config.
Current plan: Pro
Renews on Aug 1, 2026 · Visa ending 4242
Feature comparison
What is included in each plan
| Feature | Free | Starter | Pro | Enterprise |
|---|
Team
8 members · Roles below are UI examples and do not enforce server-side permissions.
Demo note: invitations and role changes update the interface only. Wire them to your backend and permission system before using in production.
| Member | Role | Status | Last active | Actions |
|---|
Settings
Configure your workspace, profile, notifications, security and appearance.
Workspace
Basic information about your workspace.
Danger zone
Deleting your workspace is permanent and cannot be undone.
Alex Morgan
Founder & CEO · Nexora Labs
Personal information
Contact details
About
Building tools that help small teams ship faster. Previously product lead at two B2B SaaS startups.
Recent activity
Notifications
3 unread notifications
You are all caught up
No notifications match this filter.
Help & support
Search the knowledge base or contact the support team.
Common questions
No results for your search
Try different keywords, or contact support below.
Contact support
Average response time is under 4 hours on business days. This form is a demo — connect it to your own helpdesk or email provider.
Documentation
Component library
Reusable building blocks used across the template. Copy the markup patterns into your own pages.
Buttons
Badges & status
Progress bars
Form controls
Feedback states
Payment of $4,200.00 was received successfully.
Your trial ends in 3 days. Add a payment method to avoid interruption.
Chart failed to load.
Skeleton loading
Empty state
Nothing here yet
New items will appear in this space.
Documentation
Quick-start, structure and customization notes for template buyers. The downloadable ZIP also ships these as Markdown files.
Quick start (no Node.js required)
- Extract the ZIP anywhere on your computer.
- Open a terminal in the extracted folder.
- Start any static server, for example:
python -m http.server 8000 # then open http://localhost:8000
No build step, database or account is needed for the demo. Python is only used as a convenient local server — any static host (Netlify, Vercel, GitHub Pages, nginx) works too.
Project structure
nexora-dashboard-ui-kit/
├── index.html ← this demo (single-file build)
├── README.md
├── LICENSE.txt
├── CHANGELOG.md
└── docs/
├── INSTALLATION.md
├── CUSTOMIZATION.md
├── COMPONENTS.md
├── PRODUCTION.md
└── FAQ.md
This preview ships as one self-contained index.html so it can never break from missing partials — the app shell, router, data and components all live in one file with clearly commented sections.
Customizing branding
- Colors & theme: edit the CSS custom properties at the top of the <style> block (--accent, --bg, radii…), or use Settings → Appearance in the demo.
- Logo & name: replace the sidebar brand block and the <title>.
- Mock data: every dataset lives in the central MOCK object and PLANS config in the script — swap in your API responses there.
- Navigation: sidebar links use data-nav; add a matching data-page section to add a page.
Production notes
- Tailwind: the CDN build is ideal for preview/prototyping. For production, compile Tailwind locally (npx @tailwindcss/cli) to ship a small static CSS file.
- Libraries (pinned): Chart.js 4.4.3 and Lucide via CDN. Self-host them if you need a fully offline bundle — both are MIT licensed.
- Backend: replace the in-memory CRUD handlers with fetch() calls to your API; keep the same render functions.
- Theme persistence: stored in localStorage (nexora-theme). Delete those lines for a stateless demo.
- License: use the included commercial license draft with your own legal review — it is not legal advice.