Runtime fingerprintToken readout from the active provider chain.
Live DS
Runtime
PlatformRottay
Rottay / ModernPlatform Flagship
Primary
#FFFFFFSecondary #A0A0A5
Radius
Compact runtime evidence across 3+ token signals.
Published DS package · Surface Recipes · Rottay / modernShared route metadata for the active runtime, kept inline so the shell reads like a thin header band.
Record editing workbench with tools and previewWorkspace surfaces are the clearest proof that the DS can handle multi-panel, multi-mode, serious application UX.
The real RecordWorkbenchSurface recipe rendered with representative, domain-free mock data. Compare layout rhythm and section cadence across engines; the app still owns data, permissions, and routing.
classicmodernrustic
Engine comparisonSurface render checkEach engine renders the same page recipe with the same active brand. Judge layout rhythm, chrome placement, and section cadence rather than the wrapper.
Rottay3 live enginesSame tenant, isolated engine
Live provider
Composition
Recipe map and contract boundary
1 structure + 1 pattern
Surfaces are page recipes: structures hold the frame, patterns carry reusable tasks, and the app provides domain state, permissions, and routing.
Structures
Page-level scaffolding
Patterns
Pattern-specific widgets
Boundary flow
Route and permissions gate access before the surface renders.
Surface config defines layout, actions, and data hooks for the page recipe.
Structures establish the page chrome and stable navigation frame.
Patterns fill the work area while product-owned logic stays outside the DS contract.
API and code
Import and usage contract
Audit focus
mode switchingtool densitypersistent context
Layer fit
Primitives
Patterns
Structures
Surfaces
ImportPublished package entrypoint, ready to copy.
tsx
1 line
Consumption
Runtime-aware snippet
import { RecordWorkbenchSurface } from '@rottay/design-system';
Usage contractPaste-ready example that shows the base contract first.