DOM Studio
Blocks
74 auto-discoveredProduction-shaped interface sections built from DOM Studio primitives: app shells, communication surfaces, conversion flows, and form-led product moments.
Catalog
Block categories
App Shells
Whole-product layouts for dashboards, workspaces, and persistent navigation.
Communication
Messaging, inbox, changelog, and announcement surfaces with realistic application density.
Conversion
Authentication, activation, and setup flows that move users into the product.
Operations
Operational workspaces for internal teams, customer success, support, and administration.
Commerce
Customer-facing purchase, order, fulfilment, and post-purchase flows for transactional products.
Content Management
Auto-discovered block family.
Work Management
Planning, prioritization, and delivery surfaces for product and operations teams.
Collaboration
Sharing, permission, and review surfaces for multi-user product workflows.
Developer Experience
Developer-facing product surfaces for API access, integration setup, observability, and platform administration.
Monetization
Billing, subscription, usage limits, pricing, and revenue-management surfaces for SaaS products.
Account Settings
User-facing settings surfaces for preferences, account safety, access, and personalization.
Financial Services
Auto-discovered block family.
Data Capture
Form-led compositions for collecting and validating structured product data.
Reliability
Customer-facing transparency, operational health, and trust-building surfaces for product reliability.
Product Management
Customer feedback, roadmap, prioritization, and product discovery surfaces for teams building apps.
Documents
Document preparation, review, signature, and handoff flows for app teams.
Trust & Safety
Review queues, policy decisions, and safety workflows for apps with user-generated content.
Analytics
Reporting, insight, and measurement surfaces for product and business teams.
Compliance
Policy, identity, privacy, safety, and governance surfaces for regulated product workflows.
Marketing
Lifecycle, messaging, audience, and campaign surfaces for growth teams.
Library
All blocks
74 of 74
Dashboard
App ShellsA responsive revenue dashboard with persistent navigation, compact metrics, reporting controls, and a mobile navigation fallback.
1 example src/pages/blocks/app-shells/dashboard
Ai Collaboration Shell
App Shells / AI WorkspacesA responsive supervised-AI shell with rich agent and workstream selection, compact review rows, approval boundaries, and audit-ready activity.
1 example src/pages/blocks/app-shells/ai-workspaces/ai-collaboration-shell
Chat
CommunicationA working support copilot with an API-backed queue, agent routing, tool evidence, retry recovery, ticket resolution, and responsive context panels.
3 examples src/pages/blocks/communication/chat
Command Palette
App ShellsA responsive command workspace with rich workspace selection, mobile navigation, recent work, and a working keyboard-first launcher.
1 example src/pages/blocks/app-shells/command-palette
Cursor Workspace
Developer Experience / AI ToolsA responsive repository change session with revisioned file edits, contextual agent proposals, reviewable diffs, focused tests, and rollback evidence.
1 example src/pages/blocks/developer-experience/cursor-workspace
Product Tour Builder
Conversion / Product ToursAn API-backed product tour studio with an interactive app canvas, rich target selection, responsive authoring modes, server launch checks, preview sessions, and signed publication receipts.
1 example src/pages/blocks/conversion/product-tours/product-tour-builder
A working mail workspace with API-backed triage, replies, composition, drafts, snooze, archive undo, rich controls, and focused responsive states.
3 examples src/pages/blocks/communication/mail
Step Up Verification
Account Settings / SecurityA responsive step-up workflow with policy-filtered proof methods, recoverable errors, and action-scoped unlocks.
1 example src/pages/blocks/account-settings/security/step-up-verification
Api Request Console
Developer Experience / API ToolsA responsive server-proxied API workspace with revisioned templates, production safeguards, immutable runs, and inspectable response evidence.
1 example src/pages/blocks/developer-experience/api-request-console
Enterprise Sso Setup
Account Settings / SecurityA responsive staged SSO workflow with verified readiness, rich role mapping, safe connection testing, and explicit activation controls.
1 example src/pages/blocks/account-settings/security/enterprise-sso-setup
Sprint Planning
Work ManagementA responsive sprint-planning room with API-backed scope moves, exact revision checks, capacity evidence, and immutable commitment receipts.
1 example src/pages/blocks/work-management/sprint-planning
Api Keys
Developer ExperienceA working credential lifecycle with one-time secret creation, scoped permissions, staged rotation, audit evidence, and revocation.
1 example src/pages/blocks/developer-experience/api-keys
Appointment Booking
ConversionA complete responsive booking section with live availability, timezone-aware slots, expiring holds, confirmation proof, and cancellation.
1 example src/pages/blocks/conversion/appointment-booking
Team Members
OperationsA working people-administration section with versioned invitations, role changes, suspensions, policies, exports, and audit receipts.
1 example src/pages/blocks/operations/team-members
Webhooks
Developer ExperienceA working webhook delivery workspace with endpoint contracts, immutable attempt evidence, guarded replay, one-time secret rotation, and responsive operational views.
1 example src/pages/blocks/developer-experience/webhooks
Feature Flags
OperationsA LaunchDarkly- and PostHog-inspired release control room with exact targeting previews, context evaluation, independent approval, guarded publication, monitoring, rollback evidence, and responsive views.
1 example src/pages/blocks/operations/feature-flags
Notification Preferences
Account SettingsA responsive notification preference center with rich selection controls, reflowing channel switches, quiet hours, required alerts, and working save state.
1 example src/pages/blocks/account-settings/notification-preferences
Approval Workflow
OperationsA working decision inbox for policy evaluation, evidence recovery, delegation, structured approval, and controlled execution.
1 example src/pages/blocks/operations/approval-workflow
Saved Filters
Work ManagementA responsive saved-view workspace with rich query rules, live issue results, explicit audiences, subscriptions, exact previews, and auditable saves.
1 example src/pages/blocks/work-management/saved-filters
Session Security
Account SettingsA responsive session-security workflow with rich device selection, confirmed revocation, recovery readiness, and filterable activity.
1 example src/pages/blocks/account-settings/session-security
Media Asset Picker
Content Management / MediaA Cloudinary- and Contentful-inspired media workspace with server-filtered browsing, recoverable ingestion, metadata approval, archiving, and receipt-backed insertion.
1 example src/pages/blocks/content-management/media/media-asset-picker
Onboarding
ConversionA complete API-backed workspace activation flow with resumable setup, source connection, invitations, and launch proof.
1 example src/pages/blocks/conversion/onboarding
Share Permissions
CollaborationAn API-backed, people-first sharing panel with rich permissions, general access safeguards, reviewable changes, and focused mobile views.
1 example src/pages/blocks/collaboration/share-permissions
Workflow Automation
Work ManagementA working automation operations room for versioned drafts, safe execution traces, exact release checks, and immutable receipts.
1 example src/pages/blocks/work-management/workflow-automation
Bulk Actions
OperationsA Shopify- and Zendesk-inspired bulk change desk with immutable impact previews, approval routing, background progress, partial-failure recovery, and durable receipts.
1 example src/pages/blocks/operations/bulk-actions
Data Import
Data CaptureAn API-backed customer import workspace with rich field mapping, revisioned validation, downloadable error reports, and a resumable background job.
1 example src/pages/blocks/data-capture/data-import
Privacy Control Center
Account Settings / PrivacyA responsive, tabbed privacy control center with rich settings choices, human-readable review state, and auditable data-rights actions.
1 example src/pages/blocks/account-settings/privacy/privacy-control-center
Screen Annotation Review
Collaboration / ReviewA responsive screen-review workspace with spatial pins, rich filtering and assignment, focused mobile threads, and complete annotation actions.
1 example src/pages/blocks/collaboration/review/screen-annotation-review
Usage Limits
MonetizationA working usage-governance section for versioned limits, forecasts, delivery tests, finance approvals, customer exceptions, checks, and enforcement rollout.
1 example src/pages/blocks/monetization/usage-limits
Entitlement Matrix
Monetization / PackagingA working packaging control plane for editing versioned entitlements, proving checkout mappings, calculating customer impact, and publishing to runtime enforcement.
1 example src/pages/blocks/monetization/packaging/entitlement-matrix
Billing
MonetizationAn organization billing console for payment methods, invoice history, billing preferences, addresses, purchase orders, and business tax IDs.
1 example src/pages/blocks/monetization/billing
App Navigation Builder
Content Management / NavigationA responsive navigation operations workspace with hierarchy editing, server-filtered audience previews, route validation, optimistic revisions, and receipt-backed publishing.
1 example src/pages/blocks/content-management/navigation/app-navigation-builder
Integration Marketplace
Developer ExperienceA working connections workspace for approved discovery, OAuth and credential setup, provider health, scope policy, sync evidence, requests, and lifecycle control.
1 example src/pages/blocks/developer-experience/integration-marketplace
Ai Prompt Lab
Developer ExperienceA working prompt registry with exact-revision saves, reusable eval datasets, output comparison, release checks, and human review handoff.
1 example src/pages/blocks/developer-experience/ai-prompt-lab
Feedback Board
Product ManagementA complete feedback operations section for capturing customer evidence, making product decisions, responding publicly, notifying contacts, and merging duplicates through a working API.
1 example src/pages/blocks/product-management/feedback-board
Forms
Data CaptureAn API-backed form operations workspace for composition, exact-revision publishing, public responses, and optimistic triage.
1 example src/pages/blocks/data-capture/forms
Support Center
OperationsAn API-backed support service desk with saved inbox views, human ticket routing, public and internal replies, delivery recovery, resolution proof, and focused responsive workflows.
2 examples src/pages/blocks/operations/support-center
Content Moderation
Trust & SafetyA responsive moderation review desk for claimed cases, contextual evidence, exact policy decisions, appeals, delivery receipts, and immutable audit history.
1 example src/pages/blocks/trust-and-safety/content-moderation
Mobile Approval Queue
Operations / ApprovalsA working mobile approvals app with task triage, policy evaluation, trusted-device verification, evidence recovery, escalation, receipts, and undo.
1 example src/pages/blocks/operations/approvals/mobile-approval-queue
Virtual Machine Control Panel
Operations / InfrastructureA working compute workspace with exact provisioning review, provider jobs, health evidence, snapshots, power operations, and responsive fleet navigation.
1 example src/pages/blocks/operations/infrastructure/virtual-machine-control-panel
Card Control Center
Financial Services / CardsA working card operations desk for policy revisions, freeze controls, travel notices, secure detail reveal, replacement lifecycle, and immutable evidence.
1 example src/pages/blocks/financial-services/cards/card-control-center
Card Dispute Flow
Financial Services / DisputesA working dispute resolution workspace for transaction triage, structured claims, verified evidence, card protection, filing checks, and immutable case receipts.
1 example src/pages/blocks/financial-services/disputes/card-dispute-flow
Document Signing
DocumentsA working envelope room for versioned documents, recipient contracts, signing fields, server readiness, provider-style delivery, reminders, callbacks, voiding, and completion evidence.
1 example src/pages/blocks/documents/document-signing
Field Dispatch Map
Operations / LogisticsA working field-service console with live routes, exact assignment checks, driver messaging, provider receipts, and responsive focused views.
1 example src/pages/blocks/operations/logistics/field-dispatch-map
Checkout Review
CommerceA responsive checkout review with rich delivery and payment dropdowns, compact order rows, readiness checks, and a sticky purchase summary.
1 example src/pages/blocks/commerce/checkout-review
Localization Review Workbench
Content Management / LocalizationA Lokalise- and Phrase-inspired, API-backed localization workbench for focused string review, translation memory, server QA, glossary handoff, and receipt-backed publishing.
1 example src/pages/blocks/content-management/localization/localization-review-workbench
Availability Pricing Calendar
Commerce / BookingAn API-backed host calendar for editing date inventory, importing holds, saving drafts, and publishing validated changes across booking channels.
1 example src/pages/blocks/commerce/booking/availability-pricing-calendar
Changelog Publisher
CommunicationA working release editor with API-backed drafts, rich targeting, channel previews, reviewer approval, scheduling, publication proof, and responsive mobile views.
1 example src/pages/blocks/communication/changelog-publisher
Incident Response
OperationsA working incident command room for accountable roles, mitigation evidence, reviewed communications, guarded lifecycle transitions, and immutable provider receipts.
1 example src/pages/blocks/operations/incident-response
Pickup Handoff
Commerce / Post-purchaseAn API-backed pickup-desk workflow for arrivals, item staging, substitution consent, customer verification, readiness gates, and final handoff proof.
1 example src/pages/blocks/commerce/post-purchase/pickup-handoff
Resource Scheduler
Operations / SchedulingA Float-inspired workforce scheduler with DomWeekPlanner, exact resource capacity, server-owned availability checks, assignment receipts, and responsive operator views.
1 example src/pages/blocks/operations/scheduling/resource-scheduler
Returns Portal
CommerceAn API-backed guided returns section for eligibility, per-item reasons, exchange stock, refund estimates, saved drafts, and immutable request proof.
1 example src/pages/blocks/commerce/returns-portal
Delivery Tracker
Commerce / Post-purchaseAn API-backed customer delivery tracker for ETA, shipment progress, persistent instructions, courier blockers, carrier updates, and proof of delivery.
1 example src/pages/blocks/commerce/post-purchase/delivery-tracker
Login
ConversionA responsive workspace gateway with password and passwordless entry, verification, session proof, authorized handoff, and sign-out.
1 example src/pages/blocks/conversion/login
Expense Capture
Operations / FinanceA Ramp-, Brex-, and Expensify-inspired expense inbox with receipt evidence, exact-revision capture, card matching, policy checks, immutable submission, approval, and accounting receipts.
1 example src/pages/blocks/operations/finance/expense-capture
Customer Health
OperationsA complete customer recovery workspace with sourced scorecards, success plans, task execution, CRM receipts, timeline evidence, and health recalculation.
1 example src/pages/blocks/operations/customer-health
Proposal Editor
Documents / EditorsA working proposal room for client-facing sections, reviewer gates, commercial line items, server readiness, delivery, view tracking, and acceptance evidence.
1 example src/pages/blocks/documents/proposal-editor
Status Page
ReliabilityA working public reliability section with regional health, component evidence, incident communication, maintenance, a JSON feed, and verified subscriptions.
1 example src/pages/blocks/reliability/status-page
Roadmap Timeline
Product Management / RoadmappingA complete portfolio roadmap section for creating initiatives, previewing dependency-aware schedule changes, posting health updates, and publishing audience-specific views through a working API.
1 example src/pages/blocks/product-management/roadmap-timeline
Sales Pipeline Kanban
Operations / SalesA responsive revenue workspace for prioritizing pipeline, reviewing exact stage transitions, retaining sales activity, and reconciling forecast evidence through a repository-local API.
1 example src/pages/blocks/operations/sales/sales-pipeline-kanban
Collapsible Sidebar Shell
App ShellsA responsive SaaS shell with a collapsible desktop rail, mobile navigation drawer, and account profile menu.
3 examples src/pages/blocks/app-shells/collapsible-sidebar-shell
Ai Document Review
Documents / ReviewA working contract review desk for cited AI findings, human clause decisions, policy controls, reviewer gates, release evidence, and redline exports.
1 example src/pages/blocks/documents/review/ai-document-review
Customer Activity Feed
Operations / Customer SuccessAn Intercom- and Stripe-inspired customer activity inbox with API-backed source evidence, accountable tasks, internal notes, customer delivery receipts, and responsive Feed, Detail, and Work views.
1 example src/pages/blocks/operations/customer-success/customer-activity-feed
Application Layout
App ShellsA responsive customer-health app shell with persistent desktop navigation, a mobile drawer, rich filters, and an account-review workflow.
1 example src/pages/blocks/app-shells/application-layout
Campaign Composer
MarketingA complete campaign operations section with revisioned drafts, audience proof, test delivery, launch receipts, worker progress, and results.
1 example src/pages/blocks/marketing/campaign-composer
Referral Program
Marketing / GrowthA working referral wallet for tracked invites, provider lifecycle events, qualification policy, milestone bonuses, and reward redemption.
1 example src/pages/blocks/marketing/growth/referral-program
Cohort Retention Heatmap
Analytics / RetentionA responsive cohort retention workspace with rich selectors, accessible cells, compact mobile cohort focus, and a working investigation flow.
1 example src/pages/blocks/analytics/retention/cohort-retention-heatmap
Report Builder
AnalyticsA focused report workflow with rich setup controls, fresh-preview readiness, scheduled delivery, and working publishing states.
1 example src/pages/blocks/analytics/report-builder
Funnel Analytics
AnalyticsA responsive funnel workflow with rich query controls, live mock datasets, visible drop-off, segment comparison, and working follow-up actions.
1 example src/pages/blocks/analytics/funnel-analytics
Identity Verification
ComplianceA resumable verification section with working profile, evidence, screening, support, conflict, and receipt-backed submission APIs.
1 example src/pages/blocks/compliance/identity-verification
Agent Run Trace
Developer Experience / AI AgentsAn API-backed agent observability workspace for trace investigation, redacted payload access, ownership, replay, eval, and export evidence.
1 example src/pages/blocks/developer-experience/ai-agents/agent-run-trace
Data Retention
ComplianceA responsive retention control plane with working impact, draft, approval, publication, legal-hold, and run-history APIs.
1 example src/pages/blocks/compliance/data-retention
Audit Log Explorer
Compliance / AuditA responsive audit investigation workspace with server-side filtering, evidence diffs, legal holds, saved views, alert rules, and verified exports.
2 examples src/pages/blocks/compliance/audit/audit-log-explorer
Usage Event Reconciliation
Monetization / Usage MeteringA working reconciliation desk for tracing metered-usage discrepancies, previewing append-only invoice corrections, collecting approval, and releasing provider updates.
1 example src/pages/blocks/monetization/usage-metering/usage-event-reconciliation