Documentation

Guides, references, and everything you need to build with thefrontkit apps.

A11y Starter Kit preview — a production-ready Next.js business app from thefrontkit: Most teams know they should do WCAG. Few know where to start. Audits come back with 200 issues and the accessibility sprint gets pushed to next quarter. This free kit gives agencies, fintech teams, and public-sector contractors 6 reference screens built to WCAG 2.1 AA: keyboard navigation with focus trapping and skip links, ARIA landmarks, screen-reader-tested semantics, dark mode with maintained contrast, and custom React hooks for common accessibility utilities.

A11y Starter Kit

Most teams know they should do WCAG. Few know where to start. Audits come back with 200 issues and the accessibility sprint gets pushed to next quarter. This free kit gives agencies, fintech teams, and public-sector contractors 6 reference screens built to WCAG 2.1 AA: keyboard navigation with focus trapping and skip links, ARIA landmarks, screen-reader-tested semantics, dark mode with maintained contrast, and custom React hooks for common accessibility utilities.

AI UX Kit preview — a production-ready Next.js business app from thefrontkit: Everyone's shipping AI features, and most of them look the same. A text box, a spinner, a wall of output, and no way for the user to correct anything. This component library fixes that with 114 components: Markdown message rendering, keyboard-navigable citation blocks, thumbs, star-rating and free-text feedback, model selection and side-by-side model comparison, voice recording, file upload with version history, and session-aware conversation history. Built for founders and product teams adding AI to existing SaaS without shipping demo-grade UX.

AI UX Kit

Everyone's shipping AI features, and most of them look the same. A text box, a spinner, a wall of output, and no way for the user to correct anything. This component library fixes that with 114 components: Markdown message rendering, keyboard-navigable citation blocks, thumbs, star-rating and free-text feedback, model selection and side-by-side model comparison, voice recording, file upload with version history, and session-aware conversation history. Built for founders and product teams adding AI to existing SaaS without shipping demo-grade UX.

SaaS Starter Kit preview — a production-ready Next.js business app from thefrontkit: Every SaaS starts the same way. Three weeks wiring auth, building a dashboard shell, styling a data table nobody will look at, and arguing about whether settings pages need tabs. None of it is the product. This Next.js SaaS boilerplate covers the scaffold so solo founders and small teams skip straight to the thing they actually care about: app shell with sidebar and topbar, auth screens, dashboard with empty states, settings pages, data tables with keyboard navigation, form primitives with inline validation, and a design token system for light and dark mode.

SaaS Starter Kit

Every SaaS starts the same way. Three weeks wiring auth, building a dashboard shell, styling a data table nobody will look at, and arguing about whether settings pages need tabs. None of it is the product. This Next.js SaaS boilerplate covers the scaffold so solo founders and small teams skip straight to the thing they actually care about: app shell with sidebar and topbar, auth screens, dashboard with empty states, settings pages, data tables with keyboard navigation, form primitives with inline validation, and a design token system for light and dark mode.

AI Feedback Assistant preview — a production-ready Next.js business app from thefrontkit: Most kit landing pages show screenshots and ask you to trust them. This one is a running Next.js app you can click through. Type a prompt, get a response, rate it, and see how it behaves on mobile, in dark mode, and with a screen reader on. The shell comes from our SaaS Starter Kit. The AI surface comes from the AI UX Kit. Buy both and you can rebuild this demo in a weekend.

AI Feedback Assistant

Most kit landing pages show screenshots and ask you to trust them. This one is a running Next.js app you can click through. Type a prompt, get a response, rate it, and see how it behaves on mobile, in dark mode, and with a screen reader on. The shell comes from our SaaS Starter Kit. The AI surface comes from the AI UX Kit. Buy both and you can rebuild this demo in a weekend.

E-commerce Starter Kit preview — a production-ready Next.js business app from thefrontkit: Shopify is fast but opinionated, and headless commerce takes a team of five to ship. This Next.js e-commerce template gives DTC founders and agencies the middle path: 56 screens across a 27-screen storefront, 14 customer account screens, a 13-screen admin panel, and 2 utility screens. A multi-step checkout ready for Stripe or any payment processor, advanced filtering by price, category, color, and size, a revenue dashboard with analytics, and WCAG AA across every screen.

E-commerce Starter Kit

Shopify is fast but opinionated, and headless commerce takes a team of five to ship. This Next.js e-commerce template gives DTC founders and agencies the middle path: 56 screens across a 27-screen storefront, 14 customer account screens, a 13-screen admin panel, and 2 utility screens. A multi-step checkout ready for Stripe or any payment processor, advanced filtering by price, category, color, and size, a revenue dashboard with analytics, and WCAG AA across every screen.

Blog CMS Kit preview — a production-ready Next.js business app from thefrontkit: Medium locks your content in, Notion isn't a CMS, and WordPress needs a plugin for everything. This kit gives writers and startup marketing teams 27 screens of a clean publishing workflow: a 9-screen public blog, a 13-screen Ghost-style admin (post editor with SEO fields, media library, subscribers, analytics), 2 auth screens, and 3 utility pages. Headless-friendly so you bring your own database.

Blog CMS Kit

Medium locks your content in, Notion isn't a CMS, and WordPress needs a plugin for everything. This kit gives writers and startup marketing teams 27 screens of a clean publishing workflow: a 9-screen public blog, a 13-screen Ghost-style admin (post editor with SEO fields, media library, subscribers, analytics), 2 auth screens, and 3 utility pages. Headless-friendly so you bring your own database.

CRM Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: Sales teams keep asking for the same thing: a pipeline they can see, contacts that aren't spread across three spreadsheets, and forecasts that update on their own. This CRM dashboard template ships 42 screens of exactly that: drag-and-drop Kanban pipeline, contact and company records with import, four analytics dashboards, team performance reports, and a full email inbox with sequences. The scaffold founders and agencies use on day one to skip six weeks of CRM plumbing.

CRM Dashboard Kit

Sales teams keep asking for the same thing: a pipeline they can see, contacts that aren't spread across three spreadsheets, and forecasts that update on their own. This CRM dashboard template ships 42 screens of exactly that: drag-and-drop Kanban pipeline, contact and company records with import, four analytics dashboards, team performance reports, and a full email inbox with sequences. The scaffold founders and agencies use on day one to skip six weeks of CRM plumbing.

Kanban PM Kit preview — a production-ready Next.js business app from thefrontkit: Jira is too much, Trello too little, and Linear is painful for anything outside a five-person engineering team. This Kanban template gives founders and agencies 45 screens of Kanban-first project management: drag-and-drop boards, sprint cycles with burndown charts, Gantt-style timeline and roadmap with milestones, a workload view with capacity status, goals with key results, and full analytics. Built for teams tired of cycling through three PM tools a year.

Kanban PM Kit

Jira is too much, Trello too little, and Linear is painful for anything outside a five-person engineering team. This Kanban template gives founders and agencies 45 screens of Kanban-first project management: drag-and-drop boards, sprint cycles with burndown charts, Gantt-style timeline and roadmap with milestones, a workload view with capacity status, goals with key results, and full analytics. Built for teams tired of cycling through three PM tools a year.

Social Media Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: Most social teams run on five tools, three spreadsheets, and a shared Notion page, and still can't tell you what last month's engagement was without an hour of copy-paste. This kit gives agencies and in-house marketing teams 35+ screens across 10 sections: multi-platform analytics for Instagram, X, Facebook, LinkedIn, TikTok, and YouTube, a content calendar with drag-and-drop scheduling, sentiment analysis with keyword tracking, competitor share of voice, and a unified social inbox.

Social Media Dashboard Kit

Most social teams run on five tools, three spreadsheets, and a shared Notion page, and still can't tell you what last month's engagement was without an hour of copy-paste. This kit gives agencies and in-house marketing teams 35+ screens across 10 sections: multi-platform analytics for Instagram, X, Facebook, LinkedIn, TikTok, and YouTube, a content calendar with drag-and-drop scheduling, sentiment analysis with keyword tracking, competitor share of voice, and a unified social inbox.

HR Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: Every growing startup hits a wall around 40 people. Spreadsheets break, leave requests live in Slack DMs, and performance reviews become a Google Doc nobody opens. This HR dashboard template gives HR leads 48 screens across 6 sections: employee directory with org chart, leave workflows with approvals, attendance heatmaps, payroll and expenses, onboarding checklists with progress rings, performance cycles with goals, and a recruitment pipeline on a Kanban board. It ships wired to Supabase (auth, Postgres, storage), so real data flows on day one.

HR Dashboard Kit

Every growing startup hits a wall around 40 people. Spreadsheets break, leave requests live in Slack DMs, and performance reviews become a Google Doc nobody opens. This HR dashboard template gives HR leads 48 screens across 6 sections: employee directory with org chart, leave workflows with approvals, attendance heatmaps, payroll and expenses, onboarding checklists with progress rings, performance cycles with goals, and a recruitment pipeline on a Kanban board. It ships wired to Supabase (auth, Postgres, storage), so real data flows on day one.

Finance Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: Finance teams live in spreadsheets for one reason: the dashboards they've been given don't answer their questions. Net worth charts with no drill-down, budget views that hide the assumptions, savings goals in a separate app nobody opens. This kit gives indie hackers, fintech founders, and small-business owners 27 screens across 3 sections: a net worth and cash flow dashboard, accounts, cards and investments with detail views, transactions with recurring payments, transfers and saved recipients, budgets and savings goals with progress tracking, and analytics with net worth trends and a monthly review.

Finance Dashboard Kit

Finance teams live in spreadsheets for one reason: the dashboards they've been given don't answer their questions. Net worth charts with no drill-down, budget views that hide the assumptions, savings goals in a separate app nobody opens. This kit gives indie hackers, fintech founders, and small-business owners 27 screens across 3 sections: a net worth and cash flow dashboard, accounts, cards and investments with detail views, transactions with recurring payments, transfers and saved recipients, budgets and savings goals with progress tracking, and analytics with net worth trends and a monthly review.

Inventory Management Kit preview — a production-ready Next.js business app from thefrontkit: Every growing ecommerce brand hits the same problem around 500 SKUs. Stock levels drift, purchase orders get lost in email, and the warehouse team ends up running the real inventory system on paper. The tools that fix it cost $500 a month and look like they were designed in 2009. This inventory management template gives ecommerce operators, 3PL providers, and DTC agencies 32 screens across 8 sections: product catalog with search and categories, purchase order workflows with receiving status, multi-warehouse management with capacity utilization, stock transfers with audit trails, and inventory reports with Recharts analytics.

Inventory Management Kit

Every growing ecommerce brand hits the same problem around 500 SKUs. Stock levels drift, purchase orders get lost in email, and the warehouse team ends up running the real inventory system on paper. The tools that fix it cost $500 a month and look like they were designed in 2009. This inventory management template gives ecommerce operators, 3PL providers, and DTC agencies 32 screens across 8 sections: product catalog with search and categories, purchase order workflows with receiving status, multi-warehouse management with capacity utilization, stock transfers with audit trails, and inventory reports with Recharts analytics.

Sales Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: Most sales dashboards get built by engineers, reviewed by the VP of Sales, and ignored by the reps who were supposed to use them. The data is there, but the answer to what should I do today isn't. This kit gives sales leaders, founders, and agencies 20 screens across 3 sections: a visual pipeline with drag-and-drop deal stages, deals, contacts and accounts, sequences, quota targets and territories, commissions, a rep leaderboard with coaching, and analytics and revenue reports. Built so reps will actually check it in the morning.

Sales Dashboard Kit

Most sales dashboards get built by engineers, reviewed by the VP of Sales, and ignored by the reps who were supposed to use them. The data is there, but the answer to what should I do today isn't. This kit gives sales leaders, founders, and agencies 20 screens across 3 sections: a visual pipeline with drag-and-drop deal stages, deals, contacts and accounts, sequences, quota targets and territories, commissions, a rep leaderboard with coaching, and analytics and revenue reports. Built so reps will actually check it in the morning.

NeuralDesk AI Ops Dashboard preview — a production-ready Next.js business app from thefrontkit: Running a single LLM feature is easy. Running ten of them across two models, with cost tracking, latency monitoring, and a way to roll back a bad prompt, is where most teams get stuck. Traditional observability tools don't speak prompt, and the AI-specific ones are either research toys or enterprise-only. This kit gives AI platform teams, ML engineers, and founders shipping AI products 21 screens across 3 sections: a model registry, a prompt library with A/B test results, a playground, evaluations and fine-tuning, token usage and cost analytics, request logs, error and incident tracking, a semantic cache, guardrails, and an audit log.

NeuralDesk AI Ops Dashboard

Running a single LLM feature is easy. Running ten of them across two models, with cost tracking, latency monitoring, and a way to roll back a bad prompt, is where most teams get stuck. Traditional observability tools don't speak prompt, and the AI-specific ones are either research toys or enterprise-only. This kit gives AI platform teams, ML engineers, and founders shipping AI products 21 screens across 3 sections: a model registry, a prompt library with A/B test results, a playground, evaluations and fine-tuning, token usage and cost analytics, request logs, error and incident tracking, a semantic cache, guardrails, and an audit log.

LMS Starter Kit preview — a production-ready Next.js business app from thefrontkit: Building an LMS from scratch means months of work on course players, quiz engines, progress tracking, and admin panels before your first student enrolls. This Next.js LMS template gives you 39 screens across an 18-screen student experience, 7-screen instructor dashboard, 8-screen admin portal, plus auth and commerce flows. Video lesson player, quiz engine with results, discussion forums, live sessions, certificates, achievements, and WCAG AA across every screen.

LMS Starter Kit

Building an LMS from scratch means months of work on course players, quiz engines, progress tracking, and admin panels before your first student enrolls. This Next.js LMS template gives you 39 screens across an 18-screen student experience, 7-screen instructor dashboard, 8-screen admin portal, plus auth and commerce flows. Video lesson player, quiz engine with results, discussion forums, live sessions, certificates, achievements, and WCAG AA across every screen.

SaaS Metrics Kit preview — a production-ready Next.js business app from thefrontkit: Building a SaaS metrics dashboard from scratch means weeks of charting libraries, data tables, and financial calculations before you can even track your first MRR movement. This Next.js SaaS metrics template gives you 50 screens across 30 analytics views, 13 management screens, 3 settings pages, plus auth flows and a 404 page. Revenue waterfall, cohort retention heatmap, churn analysis, forecasting with scenario bands, conversion funnel, industry benchmarks, NPS, experiments, feature flags, dunning, and WCAG AA across every screen.

SaaS Metrics Kit

Building a SaaS metrics dashboard from scratch means weeks of charting libraries, data tables, and financial calculations before you can even track your first MRR movement. This Next.js SaaS metrics template gives you 50 screens across 30 analytics views, 13 management screens, 3 settings pages, plus auth flows and a 404 page. Revenue waterfall, cohort retention heatmap, churn analysis, forecasting with scenario bands, conversion funnel, industry benchmarks, NPS, experiments, feature flags, dunning, and WCAG AA across every screen.

Help Desk Kit preview — a production-ready Next.js business app from thefrontkit: Building a help desk from scratch means months of ticket queues, live chat interfaces, knowledge base editors, and SLA engines before you can resolve your first customer issue. This Next.js help desk template gives you 110 screens across 9 sections plus standalone pages: dashboard with KPI metrics, full ticket lifecycle with a Kanban board, customer profiles with interaction timelines, knowledge base with a Markdown article editor, live chat with queue management, reports with agent performance and forecasting, team scheduling, automation rules with AI agent assist, comprehensive settings, plus CSAT surveys and QA scoring. WCAG AA across every screen.

Help Desk Kit

Building a help desk from scratch means months of ticket queues, live chat interfaces, knowledge base editors, and SLA engines before you can resolve your first customer issue. This Next.js help desk template gives you 110 screens across 9 sections plus standalone pages: dashboard with KPI metrics, full ticket lifecycle with a Kanban board, customer profiles with interaction timelines, knowledge base with a Markdown article editor, live chat with queue management, reports with agent performance and forecasting, team scheduling, automation rules with AI agent assist, comprehensive settings, plus CSAT surveys and QA scoring. WCAG AA across every screen.

Trading Dashboard Kit preview — a production-ready Next.js business app from thefrontkit: A Kite-inspired Next.js trading dashboard with 70 screens. Top navbar with tab navigation, always-visible watchlist panel with numbered groups and instant buy/sell actions, portfolio management with P&L tracking, order entry with order book, algo and paper trading, crypto, forex, bonds, and commodities markets, market scanner, stock screener, social trading, and risk analytics with VaR, Monte Carlo, and backtesting. Data-dense flat UI, blue color scheme, WCAG AA.

Trading Dashboard Kit

A Kite-inspired Next.js trading dashboard with 70 screens. Top navbar with tab navigation, always-visible watchlist panel with numbered groups and instant buy/sell actions, portfolio management with P&L tracking, order entry with order book, algo and paper trading, crypto, forex, bonds, and commodities markets, market scanner, stock screener, social trading, and risk analytics with VaR, Monte Carlo, and backtesting. Data-dense flat UI, blue color scheme, WCAG AA.

Booking Kit preview — a production-ready Next.js business app from thefrontkit: Building a booking system from scratch means months of calendar logic, timezone handling, availability rules, and payment flows before your first client can schedule a session. This Next.js booking template gives you 37 screens across 4 sections: a polished public booking flow with slot picking and payment, an admin dashboard with calendar views and booking management, team availability with side-by-side schedules plus round-robin and collective event types, and analytics with revenue tracking. WCAG AA across every screen.

Booking Kit

Building a booking system from scratch means months of calendar logic, timezone handling, availability rules, and payment flows before your first client can schedule a session. This Next.js booking template gives you 37 screens across 4 sections: a polished public booking flow with slot picking and payment, an admin dashboard with calendar views and booking management, team availability with side-by-side schedules plus round-robin and collective event types, and analytics with revenue tracking. WCAG AA across every screen.

Email Marketing Kit preview — a production-ready Next.js business app from thefrontkit: Build a complete email marketing platform with this production-ready Next.js template. Features a block-based email editor, visual automation flow builder, subscriber management with segments and tags, deliverability monitoring, A/B testing, and comprehensive analytics, all powered by client-side seed data with zero backend dependencies.

Email Marketing Kit

Build a complete email marketing platform with this production-ready Next.js template. Features a block-based email editor, visual automation flow builder, subscriber management with segments and tags, deliverability monitoring, A/B testing, and comprehensive analytics, all powered by client-side seed data with zero backend dependencies.

Full-Stack E-commerce Kit preview — a production-ready Next.js business app from thefrontkit: The frontend-only e-commerce template gives you the UI. This kit gives you the working backend too. 53 routes across a 22-screen storefront, 12 customer account screens, a 15-screen admin panel, and real infrastructure: Supabase database with row-level security, Supabase Auth with social login, Server Actions for every mutation, Stripe Checkout Sessions with webhook-driven order creation, and hybrid cart that works for guests and merges on login. Ship a real store, not a prototype.

Full-Stack E-commerce Kit

The frontend-only e-commerce template gives you the UI. This kit gives you the working backend too. 53 routes across a 22-screen storefront, 12 customer account screens, a 15-screen admin panel, and real infrastructure: Supabase database with row-level security, Supabase Auth with social login, Server Actions for every mutation, Stripe Checkout Sessions with webhook-driven order creation, and hybrid cart that works for guests and merges on login. Ship a real store, not a prototype.

Full-Stack CRM Kit preview — a production-ready Next.js business app from thefrontkit: The frontend-only CRM template gives you the UI. This kit gives you the working backend too. 45 routes across a sales dashboard, Kanban pipeline, contact and company management, deal tracking, email inbox, task management, reports, and settings -- all wired to Supabase. 19 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, and a shared-workspace model where the whole team sees everything. Ship a real CRM, not a prototype.

Full-Stack CRM Kit

The frontend-only CRM template gives you the UI. This kit gives you the working backend too. 45 routes across a sales dashboard, Kanban pipeline, contact and company management, deal tracking, email inbox, task management, reports, and settings -- all wired to Supabase. 19 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, and a shared-workspace model where the whole team sees everything. Ship a real CRM, not a prototype.

Full-Stack Blog CMS Kit preview — a production-ready Next.js business app from thefrontkit: The frontend-only Blog CMS template gives you the UI. This kit gives you the working backend too. 29 routes across a public blog, admin CMS, and auth -- all wired to Supabase. 11 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, public comment submission, newsletter signup, and a shared-author model where editors manage all content. Ship a real blog platform, not a prototype.

Full-Stack Blog CMS Kit

The frontend-only Blog CMS template gives you the UI. This kit gives you the working backend too. 29 routes across a public blog, admin CMS, and auth -- all wired to Supabase. 11 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, public comment submission, newsletter signup, and a shared-author model where editors manage all content. Ship a real blog platform, not a prototype.

Full-Stack Kanban PM Kit preview — a production-ready Next.js business app from thefrontkit: The frontend-only Kanban template gives you the UI. This kit gives you the working backend too. 44 routes across Kanban boards, sprint planning, modules, roadmap, workload, goals, analytics, team management, and settings -- all wired to Supabase. 31 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, and a shared-workspace model where the whole team collaborates. Ship a real PM tool, not a prototype.

Full-Stack Kanban PM Kit

The frontend-only Kanban template gives you the UI. This kit gives you the working backend too. 44 routes across Kanban boards, sprint planning, modules, roadmap, workload, goals, analytics, team management, and settings -- all wired to Supabase. 31 database tables with row-level security, Supabase Auth with social login, Server Actions for every mutation, and a shared-workspace model where the whole team collaborates. Ship a real PM tool, not a prototype.

Full-Stack LMS Kit preview — a production-ready Next.js business app from thefrontkit: The frontend-only LMS template gives you the UI. This kit gives you the working backend too. 55 routes across a student portal (dashboard, courses, lessons, quizzes, assignments, discussions, live sessions, achievements, certificates), instructor portal (course management, curriculum builder, student analytics, revenue tracking), and admin portal (user management, approvals, coupons, announcements, audit log) -- all wired to Supabase. 38 database tables with row-level security for three roles (student, instructor, admin), Supabase Auth with social login, Server Actions for every mutation, and a multi-portal model where each role sees only what they need. Ship a real LMS, not a prototype.

Full-Stack LMS Kit

The frontend-only LMS template gives you the UI. This kit gives you the working backend too. 55 routes across a student portal (dashboard, courses, lessons, quizzes, assignments, discussions, live sessions, achievements, certificates), instructor portal (course management, curriculum builder, student analytics, revenue tracking), and admin portal (user management, approvals, coupons, announcements, audit log) -- all wired to Supabase. 38 database tables with row-level security for three roles (student, instructor, admin), Supabase Auth with social login, Server Actions for every mutation, and a multi-portal model where each role sees only what they need. Ship a real LMS, not a prototype.