Fieldbook
Sign in

Overlays

Command palette

A search overlay opened by a button or Ctrl K that filters grouped commands, moves a highlight with the arrow keys, runs the selected one on Enter and reports the result.

Using Command palette

A search overlay opened by a button or Ctrl K that filters grouped commands, moves a highlight with the arrow keys, runs the selected one on Enter and reports the result.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: placeholder, accent

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

Banner header dialog
1919Banner header dialogOverlaysA modal window with a colored banner strip across its top edge, sitting over a dimmed and fully inert copy of the page behind it.
Confirm action modal
2324Confirm action modalOverlaysA centered confirmation dialog that springs open over a dimming backdrop, asking the visitor to confirm or cancel a destructive action.
Custom shell lightbox
1948Custom shell lightboxOverlaysA gallery grid that opens a borderless full-bleed lightbox, showing how one open, close and focus engine can wear a completely custom shell.
Dismissible Dialog
2335Dismissible DialogOverlaysA general-purpose centered dialog that opens over a blurred backdrop and can be casually dismissed by its close button, the backdrop or Escape.
Focus-Trapped Modal Kit
2156Focus-Trapped Modal KitOverlaysA bare-bones modal foundation whose whole point is disciplined keyboard behavior: it traps focus while open and restores it precisely on close, wrapped in a tilt-in entrance.
Scrollable modal dialog
2419Scrollable modal dialogOverlaysA general-purpose modal with a header, a body that scrolls independently once its content overflows, and a footer, closable by its own close button, an outside click, or Escape.