Pages
Build your site like you produce your content. Visual builder, typed blocks, per-revision versioning, prospect variables, dedicated sessions.
Overview
Pages is Kernel's visual builder. You build your site (landing, presentation, blog) by composing typed blocks. Each page is versioned (git-like revision): you can roll back, compare, publish a specific revision.
Variables {{prospect.first_name}}, {{prospect.company}}, {{audit.summary}} let you personalize a presentation for a specific prospect. You generate a presentation session, the prospect opens a dedicated link displaying their version.
Rendering is served by a DB-driven Astro renderer. The SaaS theme engine (S1-S11) handles design variables (colors, fonts, spacings) per workspace. Each workspace can carry a custom domain and its own branding.
What the module does
3-mode editor
The builder ships a [Visual | AI | Code] toggle in the toolbar. Visual = drag-drop + inspector. AI = chat + textarea to generate a full page from prompt. Code = Monaco editor for custom HTML blocks. All three modes share the same block AST (single state, continuous undo/redo).
AI Mode: generate from prompt
Describe the page you want (ex: 'sales page for my 6 000€ coaching'), the AI generates 6-12 blocks with ready-to-edit copy. Output is structured automatically. Also available via /pages/new 'AI' path to create a page from scratch.
Code Mode: custom HTML
rawHtml block now open to all owners (was super_admin only). Monaco editor with syntax highlighting. sanitize-html on save + at render time: <script>, on* handlers and javascript: URLs are stripped. Iframes whitelisted to YouTube/Vimeo/Spotify/Google Docs. Liquid vars: {{ workspace.name }}, {{ page.title }}.
/pages/new: 3 paths
Page picker with 3 cards: Blank (legacy form), Template (5 curated templates: landing coaching, about, pricing 3 tiers, contact, blog post), AI (prompt -> page generated immediately). Every path redirects straight into the editor.
Typed blocks
47 types: hero, piliers, founder, ctaFinal, pricing, FAQ, testimonials, rawHtml, container, columns, and more. Each block has its Zod schema and Astro renderer.
Git-like versioning
Each page carries a revision history. You publish a given revision. You can roll back, diff, branch.
Prospect variables
You insert {{var}} in the content. You create a session per prospect: on open, the variables resolve. Perfect for 1:1 presentations.
Presentation sessions
/p/<session_token> serves a unique version of the page for one prospect. Visit tracking, time spent, sections viewed.
SaaS theme engine + wizard
Design tokens (colors, fonts, radius, spacings) apply per workspace. The /settings/brand/wizard sets them in 5 steps (see Theme module). Override directly in /pages/[id]/theme.
Per-workspace branding and SEO
Member app + Pages + Blog render the current workspace branding and SEO. page-assets bucket, og_image_path per page.
Custom domains
Vercel Domains API, add in a few clicks. Auto verification, managed certificate.
How to use it
- 01
Create a page
/pages/new. Pick a template (landing, presentation, blog post) or start blank.
- 02
Compose
Drag-drop blocks. Fill the content, see the live preview.
- 03
Theme
Tweak design variables in /theme. Colors, fonts, spacings.
- 04
Variables
Insert {{prospect.first_name}} where you want personalization.
- 05
Publish
Click Publish. The revision goes live on your domain.
- 06
Sessions
For a 1:1 presentation, generate a session linked to a CRM contact.
Preview
Routes in Kernel
- /pages
- /pages/[id]
- /pages/[id]/revisions
- /p/[session]