Skip to content
GetUrUI

Living Documents

2 variantsPro
.md

A single document page that builds, annotates and finalises itself on a loop.

illustrationsvgdocumentcontractreportpdfloop

Contract

contract.tsx

A clause is highlighted and annotated, the signature writes itself and a stamp lands.

$npx shadcn@latest add @geturui-pro/living-documents-contract
PropTypeDefaultDescription
speednumber1Speed multiplier for the loop (seven seconds at 1).
titlestring—Accessible description of the scene, used as the aria-label.
classNamestring—Classes for the SVG; it fills its container width and keeps its ratio.

Report

report.tsx

KPI tiles, growing bars and a trend line build the page while the next page slides out.

$npx shadcn@latest add @geturui-pro/living-documents-report
PropTypeDefaultDescription
speednumber1Speed multiplier for the loop (seven seconds at 1).
titlestring—Accessible description of the scene, used as the aria-label.
classNamestring—Classes for the SVG; it fills its container width and keeps its ratio.

Install the whole set

Installs every living documents variant at once. Each section above has its own command for a single variant.

Pro installs use your private registry token. Add the @geturui-pro registry once — setup guide. The command works after you get Pro.

$npx shadcn@latest add @geturui-pro/living-documents

Accessibility

  • Rendered as a single SVG with role="img" and an aria-label you can override with `title`; nothing inside is focusable.
  • Under prefers-reduced-motion the scene renders one meaningful still frame: no loops, no timers.
  • Colours come from the GetUrUI tokens only, so the scene follows light and dark themes automatically.

Related