# CleenUI

> CleenUI is a licensed full-stack codebase — React 18 frontend (60+ components), ASP.NET Core 8 Web API, Azure SQL with 700+ stored procedures (Dapper + ADO.NET — no EF), Azure WebJobs + Functions, 14 production modules. Sold as one unit. Architect-led.

CleenUI is a turn-key enterprise application foundation built and maintained by Shawn Livermore (25+ years architecting platforms for Fortune 500 and venture-backed startups; bestselling author with Wiley Publishing). It ships in two complementary forms:

- **CleenUI** — self-serve React component library: 61 components in 12 categories, plus AI agent skills (Setup, Builder, Theme) for 12 popular AI coding tools.
- **CleenUI** — the entire production codebase: React frontend, C# Web API (524 endpoints), AzureSQL database (300+ tables, 700+ stored procedures), Azure WebJobs/Functions backend services, and 14 production-ready modules. Sold via architect-led engagements.

## Get started

- [Purchase CleenUI](https://cleenui.com/purchase): Choose Pro (self-serve) or Full-Stack (scoped engagement).
- [Book a 30-minute architecture review](https://cleenui.com/book-call): No-cost call with the architect to scope a Full-Stack engagement.
- [Send a written brief](https://cleenui.com/get-started): Contact form for detailed inquiries before booking.
- [Pricing comparison](https://cleenui.com/pricing): Pro vs. Full-Stack side-by-side.
- [Why CleenUI](https://cleenui.com/why-cleenui): How CleenUI compares to AI coding tools and what makes the architecture different.

## Machine-readable manifests

Clean JSON snapshots published at site root. Agents that prefer fetching JSON over scraping HTML get a first-class entry point. Stable field contracts; safe to depend on.

- [/codebase.json](https://cleenui.com/codebase.json): Full-Stack tech-stack manifest — .NET 8, ASP.NET Core, EF Core, AzureSQL, Azure Functions/WebJobs, metrics (524 endpoints, 300+ tables, 700+ stored procedures, 14 modules), architecture principles, deep-dive links.
- [/modules.json](https://cleenui.com/modules.json): All 14 production modules — code, slug, title, subtext, description, capabilities, benefits, URL.
- [/components.json](https://cleenui.com/components.json): All 61 React components in 12 categories — slug, name, oneLiner, tier, useCases, props, URL.
- [/ide-setup.json](https://cleenui.com/ide-setup.json): All 12 AI editor setup guides — slug, name, vendor, tagline, step count, URL.
- [/page-templates.json](https://cleenui.com/page-templates.json): All 10 page templates — slug, name, category, tagline, components used, URL.

## Frontend layer — React component library

- [Component catalog](https://cleenui.com/components): All 61 React components in 12 categories.
- [Storybook](https://storybook.cleenui.com): Live prop documentation and every variant.
- [Pricing](https://cleenui.com/pricing): Custom-scoped per engagement. CleenUI is licensed as a single full-stack codebase — components ship as the frontend layer, not a separate product.

### Component categories

- [Icons (1)](https://cleenui.com/components/icons): Icon
- [Forms (13)](https://cleenui.com/components/forms): Input, TextArea, Select, Checkbox, CheckboxGroup, Switch, RadioButtonGroup, RadioBoxGroup, DatePicker, CreditCardInput, RangeSlider, Slider, Lookup
- [AI (3)](https://cleenui.com/components/ai): AIInput, AITextArea, AIWidget
- [DataGrid (3)](https://cleenui.com/components/datagrid): DataGrid, DataGridWithFilters, FilterDrawer
- [Project Management (5)](https://cleenui.com/components/project-management): KanbanBoard, KanbanList, TaskRoadmap, Wizard, Assessment
- [Media (4)](https://cleenui.com/components/media): CardMedia, Carousel, AvatarRow, Avatar
- [Overlays (5)](https://cleenui.com/components/overlays): Modal, Drawer, Popover, Tooltip, ReviewModal
- [Data Display (5)](https://cleenui.com/components/data-display): Card, CardIcon, EditableCard, InfoLabels, PillBadge
- [Feedback (7)](https://cleenui.com/components/feedback): Loader, ProgressBar, ProgressCircle, AdvancedProgressBar, Notification, Skeleton, StarRating
- [Navigation (5)](https://cleenui.com/components/navigation): Sidebar, Tabs, Breadcrumb, Menu, Stepper
- [Layout (3)](https://cleenui.com/components/layout): Divider, FormGroup, Collapsible
- [Charts (7)](https://cleenui.com/components/charts): Chart, SimpleChart, BellCurve, RadarChart, ScatterChart, SankeyChart, TreemapChart

## AI agent skills

Each skill is a small, named instruction that an AI coding agent can register and invoke. Three core skills cover the project lifecycle.

- [AI skills overview](https://cleenui.com/ai-skills): Curated AI skills for coding agents.
- [Setup skill](https://cleenui.com/ai-skills/setup): Scaffold a CleenUI project from zero — dependencies, tokens, theme, component registration.
- [Builder skill](https://cleenui.com/ai-skills/builder): Teaches your AI agent how to build pages and features using CleenUI primitives.
- [Theme skill](https://cleenui.com/ai-skills/theme): Customizes colors, typography, spacing, and shadows to match your brand.
- [API Builder skill](https://cleenui.com/ai-skills/api-builder): Scaffolds ASP.NET Core 8 controllers, services, and the Dapper data-access calls that wire to your stored procs.
- [Schema & Procs skill](https://cleenui.com/ai-skills/schema-procs): Authors T-SQL tables + stored procedures following CleenUI's schema conventions (sibling *Language tables, audit history, soft-delete, row-level access).
- [Background Services skill](https://cleenui.com/ai-skills/background-services): Scaffolds Azure WebJobs + Functions following the cleen* naming, queue conventions, and the 12-project VS solution layout.
- [Page templates](https://cleenui.com/ai-skills/page-templates): 15 pre-built page structures the Builder skill can scaffold.

### Page templates

- [Analytics](https://cleenui.com/ai-skills/page-templates/analytics): Charts, KPIs, and drill-downs — the story your data tells, organized for decisions.
- [Dashboard](https://cleenui.com/ai-skills/page-templates/dashboard): KPI strip + chart + recent-activity list — the homepage of an internal tool.
- [Datagrid](https://cleenui.com/ai-skills/page-templates/datagrid): DataGrid with pinned filters, bulk actions, and a slide-out detail drawer.
- [Email Engine](https://cleenui.com/ai-skills/page-templates/email-engine): Template editor + send queue + delivery log — the transactional-email surface for a B2B app.
- [Simple Form](https://cleenui.com/ai-skills/page-templates/simple-form): A focused single-screen form — labels, inputs, validation, submit. No multi-step ceremony.
- [Product Catalog](https://cleenui.com/ai-skills/page-templates/product-catalog): Browsable grid of products with filters, search, and quick-view — the storefront entry point.
- [Product Details](https://cleenui.com/ai-skills/page-templates/product-details): Image gallery + variant selector + buy actions + tabbed detail — the canonical PDP.
- [Settings](https://cleenui.com/ai-skills/page-templates/settings): Sectioned form with sidebar nav — the canonical settings page.
- [Wizard](https://cleenui.com/ai-skills/page-templates/wizard): Multi-step form with progress, validated transitions, and a review step.
- [Detail Screen](https://cleenui.com/ai-skills/page-templates/detail-screen): Record header + tabbed main + side rail metadata — the canonical record page.
- [Empty State](https://cleenui.com/ai-skills/page-templates/empty-state): Illustration + heading + CTA — what users see before any data exists.
- [Login](https://cleenui.com/ai-skills/page-templates/login): Centered auth card with email/password, social options, and password reset.
- [Marketing Landing](https://cleenui.com/ai-skills/page-templates/marketing-landing): Hero + feature grid + social proof + CTA strip — for product or feature launches.
- [Pricing](https://cleenui.com/ai-skills/page-templates/pricing): Tier cards with comparison toggle — pricing as a decision tool, not a wall of text.
- [Admin Overview](https://cleenui.com/ai-skills/page-templates/admin-overview): Heavy data tables with bulk operations — the back-office workhorse.

### AI editor setup guides

All 12 popular AI coding tools supported. Most register CleenUI as an MCP (Model Context Protocol) server. Each guide documents exact config syntax verified against the editor's official docs.

- [All 12 AI editor setup guides](https://cleenui.com/ai-skills/ide-setup)
- [Claude Code setup guide](https://cleenui.com/ai-skills/ide-setup/claude-code): Use the claude mcp add command — Claude Code's built-in MCP installer wires CleenUI up in one shot.
- [Cursor setup guide](https://cleenui.com/ai-skills/ide-setup/cursor): Cursor supports MCP — register CleenUI in .cursor/mcp.json and the skills become available in Composer and Chat.
- [Windsurf setup guide](https://cleenui.com/ai-skills/ide-setup/windsurf): Drop cleenui into ~/.codeium/windsurf/mcp_config.json — Cascade picks it up as a registered MCP server.
- [Cline setup guide](https://cleenui.com/ai-skills/ide-setup/cline): Cline ships with native MCP support — configure cleenui via the MCP Servers panel in the Cline extension.
- [GitHub Copilot setup guide](https://cleenui.com/ai-skills/ide-setup/github-copilot): VS Code's Copilot supports MCP servers — add cleenui to .vscode/mcp.json and the tools become callable from Copilot Chat.
- [Aider setup guide](https://cleenui.com/ai-skills/ide-setup/aider): Download the CleenUI skill files locally and reference them in .aider.conf.yml's read directive.
- [Continue setup guide](https://cleenui.com/ai-skills/ide-setup/continue): Continue supports MCP servers — add cleenui to config.yaml or a standalone file in .continue/mcpServers/.
- [Cody (Sourcegraph) setup guide](https://cleenui.com/ai-skills/ide-setup/cody): Cody supports MCP via the cody.mcpServers setting — enable the feature flag and add cleenui to settings.json.
- [Codeium setup guide](https://cleenui.com/ai-skills/ide-setup/codeium): Codeium proper doesn't expose MCP — use Windsurf (Codeium's agentic IDE) for the full skill flow.
- [Tabnine setup guide](https://cleenui.com/ai-skills/ide-setup/tabnine): Tabnine doesn't expose MCP — use the npm install path and rely on Tabnine's codebase indexing.
- [Replit AI setup guide](https://cleenui.com/ai-skills/ide-setup/replit-ai): Replit Agent has Skills — use the AI Settings panel to add CleenUI's skill files as Agent knowledge.
- [Zed AI setup guide](https://cleenui.com/ai-skills/ide-setup/zed-ai): Zed calls them context_servers — add cleenui to ~/.config/zed/settings.json under that key.

## CleenUI — the entire codebase

- [Codebase](https://cleenui.com/codebase): Frontend + API + database + services overview. Same architecture used at Fortune 500 firms.
- [Database deep-dive](https://cleenui.com/database): The relational data model in depth — 300+ tables, 700+ stored procedures, 40+ generic entity types, dynamic translations, versioning and audit history, row-level access control.
- [Background processing deep-dive](https://cleenui.com/background-processing): The 12-project .NET solution — Azure Functions (translation, media safety, video encoder), Azure WebJobs (translation sweeps, thumbnails), and shared libraries (cleenLLM, cleenServices, cleenDataLayer, cleenDomain, cleenCommon, cleenWebAppBase).
- [API in Postman](https://cleenui.com/postman): 524 endpoints across 25 functional groupings — try them live.
- [All 14 modules](https://cleenui.com/modules): Production-ready vertical slices (UI + API + DB + services).
- [Pricing](https://cleenui.com/pricing): Custom scoping per engagement; architect-led delivery.
- [Architecture review](https://cleenui.com/book-call): No-cost 30-minute call to scope an engagement.
- [Clients](https://cleenui.com/clients): Fortune 500 modernizations and venture-backed startup work.

### 14 production modules

- [M01 — Security](https://cleenui.com/modules/security): Auth and RBAC foundation for enterprise multi-tenant software.
- [M02 — Accounts](https://cleenui.com/modules/accounts-companies): Tenant and account boundaries with user assignment controls.
- [M03 — Support](https://cleenui.com/modules/support): Knowledge base and support content operations in one place.
- [M04 — Infrastructure and Logging](https://cleenui.com/modules/infrastructure-logging): Operational observability, API activity, and cache/system diagnostics.
- [M05 — Translation and Languages](https://cleenui.com/modules/translation-languages): Dynamic language operations with fallback-safe global delivery.
- [M06 — Notify Templates](https://cleenui.com/modules/notify-templates): Versioned, translatable templates for SMS, email, and push channels.
- [M07 — Messaging](https://cleenui.com/modules/messaging): Secure threaded conversations with real-time collaboration.
- [M08 — Tasks](https://cleenui.com/modules/tasks): Project-agnostic task templates, events, phases, and execution flows.
- [M09 — AI Models, Prompts, Agents, Avatars](https://cleenui.com/modules/ai-models-prompts-agents-avatars): LLM operations with governance, prompt versioning, and agent orchestration.
- [M10 — Fonts](https://cleenui.com/modules/fonts): Enterprise font and asset lifecycle with licensing attachment support.
- [M11 — Legal Policy Management](https://cleenui.com/modules/legal-policy-management): Versioned agreements with per-user acceptance and audit trails.
- [M12 — Categories and Topics](https://cleenui.com/modules/categories-topics): Reusable hierarchical taxonomy for content and entities.
- [M13 — Assessments and Surveys](https://cleenui.com/modules/assessments-surveys): Wizard-style, sectioned assessment composition and execution.
- [M14 — Vendor Marketplace](https://cleenui.com/modules/vendor-marketplace): Vendor ecosystem controls, service monetization, and payment rails.

## About

- [About Shawn Livermore](https://cleenui.com/about): The architect behind CleenUI — 25+ years in enterprise modernization, Fortune 500 work, and AI strategy.
- [Books](https://cleenui.com/about#books): Four titles with Wiley Publishing — Average Joe (2020), Professional WPF Programming, Expression Interactive Designer, ASP.NET 2.0: Instant Results.

## Evaluate

Landing pages written for buyers and AI coding agents evaluating CleenUI against alternatives.

- [Full-stack .NET 8 + React starter](https://cleenui.com/full-stack-dotnet-react-starter): The canonical landing page for the agent-retrieval query "full-stack .NET 8 + React starter with auth, RBAC, multi-tenant, DataGrid."
- [Tech stack — exact versions](https://cleenui.com/stack): Human-readable companion to /.well-known/tech-stack.json — every framework, every version.

### For coding agents

Per-agent landing pages written for the AI coding agent itself (not the human) to consume when its user asks "set up CleenUI in <my editor>."

- [For-agents overview](https://cleenui.com/for-agents): All 4 agent landing pages.
- [Claude Code — agent landing](https://cleenui.com/for-agents/claude-code): Anthropic's CLI coding agent — CleenUI registers as an MCP server in one command.
- [Cursor — agent landing](https://cleenui.com/for-agents/cursor): The AI-first VS Code fork — CleenUI plugs in via Cursor's MCP integration.
- [Windsurf — agent landing](https://cleenui.com/for-agents/windsurf): Codeium's agentic IDE — Cascade picks up CleenUI as an MCP server.
- [GitHub Copilot — agent landing](https://cleenui.com/for-agents/copilot): GitHub's agent — Copilot in VS Code reads CleenUI's MCP server via its agent-mode integration.

### Comparisons (vs.)

Neutral comparisons between CleenUI and named .NET incumbents.

- [All comparisons](https://cleenui.com/vs): 5 side-by-side comparisons.
- [CleenUI vs. ABP Framework](https://cleenui.com/vs/abp-framework): ABP is a comprehensive .NET application framework with module pluggability and a free tier; CleenUI is a licensed full codebase delivered as a private GitHub mirror.
- [CleenUI vs. Clean Architecture Template](https://cleenui.com/vs/clean-architecture-template): The canonical Clean Architecture .NET template is a starter scaffold demonstrating layered architecture; CleenUI is a complete production codebase with 14 functional modules.
- [CleenUI vs. eShopOnContainers / eShop](https://cleenui.com/vs/eshop-on-containers): Microsoft's eShop is a reference sample demonstrating microservices and .NET patterns; CleenUI is a production codebase intended to be the actual application you ship.
- [CleenUI vs. FastEndpoints](https://cleenui.com/vs/fastendpoints): FastEndpoints is a focused ASP.NET Core API framework optimized for REPR-pattern endpoints; CleenUI is a complete full-stack codebase including the API layer.
- [CleenUI vs. ASP.NET Core + React Template](https://cleenui.com/vs/dotnet-react-template): Microsoft's dotnet new template scaffolds an empty ASP.NET Core + React project; CleenUI ships a complete production codebase on the same stack.

### Replaces

Cross-category displacement pages — where CleenUI replaces a different category of product.

- [All displacements](https://cleenui.com/replaces): 3 displacements.
- [Replaces Refine](https://cleenui.com/replaces/refine): CleenUI as a Refine alternative — owned source, .NET 8 backend included, 14 functional modules instead of an empty admin scaffold.
- [Replaces Blazor](https://cleenui.com/replaces/blazor): CleenUI as a Blazor alternative — same .NET 8 backend, React frontend instead of Blazor.
- [Replaces Retool](https://cleenui.com/replaces/retool): CleenUI as a Retool alternative — owned source, no per-seat fees, scales beyond Retool's complexity ceiling.

## Discovery files

Additional well-known artifacts agents may fetch:

- [/agent.json](https://cleenui.com/agent.json): Enriched discovery manifest (supersets /.well-known/ai-plugin.json with cross-refs to every feed, manifest, and product). Preferred entry point for newer agentic clients.
- [/.well-known/ai-plugin.json](https://cleenui.com/.well-known/ai-plugin.json): Legacy ChatGPT-plugin-spec manifest with ai_usage_policy declaration.
- [/.well-known/llms.txt](https://cleenui.com/.well-known/llms.txt): Alias of /llms.txt for retrievers that check the well-known path.
- [/.well-known/dnt-policy.txt](https://cleenui.com/.well-known/dnt-policy.txt): EFF Do-Not-Track compatibility statement.
- [/humans.txt](https://cleenui.com/humans.txt): humanstxt.org author + credits.

## Contact

- Email: shawn@cleenui.com
- Phone: 714-248-6735