Product / Live previewPreview session connected

See the draft on
your actual site.

Open Preview from Cairn and your own Next.js site switches to draft content. You keep the routes, components and deployment; Cairn handles signed access and live refresh after every save.

/ How it works

A short-lived preview token switches your site from published reads to draft-aware reads. Seamless and secure.

/ Round trip4 steps

Open PreviewDashboard
Verify accessSigned
Read the draftScoped
Refresh on saveLive

/ Try it

Try the demoRead the guide

/ The preview flow

One front end.
Two content views.

Outside preview mode, your site reads published content. Open Preview and the same site reads the selected dataset’s draft or branch content through a signed session.

/ Interactive example

Change the draft.
Watch the page follow.

This simplified example shows the real division of work: Cairn holds the draft, while your own front end renders it. In a connected project, changes appear after the Dashboard autosaves.

Editor · article.7f3a91Draft · unpublished

theme · enum

viewport

166 chars · saved just now

your-site.com/journal/gneiss1440 × auto

your-site.com/journal/gneiss

Journal — 24.08.2026

The quiet mathematics of stacked stone, revisited

A cairn is a promise between strangers: someone came this way, and this is the path. We built a CMS on the same idea.

hero · asset reference

/ Draft isolation

Preview the change.
Keep visitors on published.

Preview sessions use token-gated draft reads. Ordinary site requests continue through Cairn’s public, published-only API until you choose to publish.

2 fields changed · draft vs published

Publishedlive

title · stringThe quiet mathematics of stacked stone
standfirst · portableTextA cairn is a promise between strangers: someone came this way, and this is the path.
theme · enumPaper

Draftunpublished

title · stringThe quiet mathematics of stacked stone, revisited
standfirst · portableTextA cairn is a promise between strangers: someone came this way, and this is the path. We built a CMS on the same idea.
theme · enumPaper

/ Your front end

Your site does
the work.

Cairn supplies draft-aware content. Your application supplies the routes, components, styles, assets and deployment. Preview mode changes the content source, not the front end.

SiteYours, unmodified
ComponentsYour production code
ContentDraft or branch view
RoutingMapped by your app
signed draft read → your components → your site

Purpose

Full-bleed editorial plate that carries the glass-over-stone material story between the share mechanics and the integration detail.

/ Integrations

Ready for your
framework of choice.

The preview client is framework-agnostic: it hands you draft-aware data. Everything else is your own front end.

ReactNext.jsdraftMode() + revalidate hookVueNuxtuseCarinPreview composableIslandsAstroserver islands, live socketsSvelteSvelteKitload() with draft tokenReactRemixloader-level draft contextStaticHugowatch mode via webhookHTTPAnythingREST + SSE, 30 lines

100%

Draft content isolated

Nothing in a preview reaches the published API until it is released.

1

Front end, no separate app

The preview renders through the same site your visitors get.

2h

Default link expiry

Shorten or extend it per link — nothing is shared indefinitely by default.

“Our editors stopped asking engineers what a change would look like. They just look at it.”

Editorial team, early access partner

/ Elsewhere in Cairn

Live preview is one
stone in the stack.

ModelContent modelsDefine fields, references and validation visually.Read →ShipBranchingPrepare and review isolated content changes.Read →ModelDatasetsManage environments and delivery routes.Read →BuildContent APIDeliver published content and authenticated drafts.Read →CreateEditor searchFind documents across the active dataset.Read →ShipBackupsEncrypted weekly protection and paid recovery.Read →

/ Start

Preview it
before you ship it.

Start freeSet up preview