Lattice UI Docs Docs

Why Lattice UI

Why Lattice UI exists, what it is good at, and where to start.

On this page

Lattice UI is a headless-first component stack for Roblox product UI. Interaction contracts, focus behavior, layering, and state ownership stay in the package. Visual structure, styling, and screen composition stay in the app that ships the interface.

Get Started

Start with one real screen

Use one complete flow to see how the stack fits together before browsing package pages.

  • Build a Settings Dialog

    Follow one settings screen from shell structure to dialog, fields, and selection flows.

  • Quick Start

    Choose between create for a new app and init for an existing one.

Prepare a workspace

Set up the CLI and execution mode before you start composing screens from multiple packages.

  • Installation

    Install lattice-ui, verify binaries, and bootstrap a project.

  • CLI

    Review commands, presets, dry-run behavior, and troubleshooting guidance.

Reading Order

  1. Set up the workspace and confirm the CLI flow.
  2. Build the settings dialog to see one coherent screen instead of disconnected snippets.
  3. Read Style, System, and Layer before moving into specific packages like Dialog, Select, or Text Field.