Container queries
ProductCard adapts to its own width via @container instead of viewport breakpoints.
Popover/dialog API
Modal/drawer surfaces use native <dialog> + the Popover API with a React fallback.
View Transitions
Smooth morphing transitions (ProductCard → PDP) via document.startViewTransition().
Live Canvas (3D)
A performance-first Three.js hero: four built-in WebGL scenes (floating geometry, particle field, morphing blob, wireframe terrain), auto-tinted from your theme palette, lazy-loaded after paint so Core Web Vitals never regress. Reduced-motion / save-data / no-WebGL all fall back to a clean gradient. The twist: configure it with words — the AI sets scene + intensity via the `three.configure` tool.
Resolvable Genome
A Resolvable Genome: registered copy fields (e.g. footer.tagline) render from override ?? resolved-cache ?? brand anchor, harmonised against your identity anchors. Render never calls an LLM — resolution is triggered deliberately in the admin. Respawn a whole shop's voice from a sentence.
Per-entity voiced copy
PDP/PLP prefer a genome entity-override for a product/category description over the entity's own text. Set overrides via the genome.set_entity_copy tool. Default-off → render byte-identical.
Vertical / Voice presets
Packaged industry voices (kindergarten, carpenter, café, salon) on /admin/verticals — apply identity anchors + pre-written genome copy to re-tone the homepage in one click, optionally with a suggested design. Orthogonal to the skin (mix any Voice with any design). The applied copy shows on the storefront when genomeResolve is on. Default-off: hides the admin panel; nothing is applied until enabled.
Mixer preview route
Enables /<locale>/mixer-preview?design=&vertical= — renders any Skin × Voice combination ephemerally (no DB write, always noindex) so the public mixer on cartwright.app can iframe it. Default-off: in production the route 404s (canary-safe); in dev it always renders.
Section layout override (studio)
AI agents can reorder/hide sections of the studio homepage via layoutJson. Other design packs ignore the field.
Visual Builder
Admin-only visual designer layer (/admin/visual-builder): build/edit per-page section trees via live preview + inspector. All mutation goes through pages.set_layout (tool registry + audit). Route-mount gated → requires redeploy.
Design import
Pull a colour palette from any URL (Firecrawl + AI) into a live theme in ~2 minutes. Clone the vibe of an existing site, then make it yours.
Hoptify onboarding
A Shopify-familiar storefront design plus an import onboarding that brings an existing shop's look (palette) and products across — a guided migration path for merchants moving off a hosted platform.
Site-import (rebuild as drafts)
content.import_site: scrape an existing site (Firecrawl) and rebuild it as Cartwright drafts (pages/services/blog + hero images) for review. Default-off until the admin review UI ships.
SitePack (export/import a whole site)
sitepack.export / .import: snapshot the entire site (design + content + products + media + branding) as a portable .cartpack and restore it onto a newer Cartwright. Default-off until the admin Snapshot/Restore UI ships.
Logo generator (Gemini)
Generate a real raster logo from a prompt via gemini-2.5-flash-image, upload it to Vercel Blob, and set it as your brand mark — in one step, from the admin.
v0 UI generation
Generate storefront sections via the Vercel v0 Platform API (text→UI) as an alternative AI engine in the Vibe Sandbox. v0's code is normalized to HTML + sanitized and persisted as vibeHtml (never TSX-to-disk). Requires a v0 key in /admin/integrations.
Magic Builder
Describe a page in plain language and watch it build itself — section by section, live in the preview. The inverse of code-generators: the prompt can only emit a plan of whitelisted, on-brand section atoms, each filled with Zod-validated data (never a tag, colour or font the model invented). Output lives as governed data — audited, one-click revertible — not throwaway code.
Motion & effects
Makes the pages feel 'alive': scroll-driven reveal animations (CSS animation-timeline: view() — runs on the compositor thread, no JS jank), animated aurora gradient + glassmorphism, and a per-section effect vocabulary Magic Builder can assign. A shop preset (subtle/bold/off) scales the whole feel via data-motion on <html>. Everything feature-detected (@supports) + prefers-reduced-motion-safe + falls back to a static render (RevealOnScroll). Off ⇒ data-motion="off" ⇒ byte-identical render (canary-safe).
Speculation Rules (prefetch)
Emits a document-level <script type="speculationrules"> so Chromium prefetches likely next navigations (product/cart/checkout, excluding /admin + /api + [data-no-prefetch]) at `moderate` eagerness — faster PLP→PDP→checkout without leaving the server model. Progressive enhancement: ignored in browsers without support (Firefox/Safari), so no behavior change there. `type="speculationrules"` is NOT executable JS (no CSP script-src concern). Off ⇒ no script emitted ⇒ byte-identical render (canary-safe).