Introduction
Blocks are the core building units of OpenUI. Think of them like LEGO pieces for generative interfaces: small, self-contained UI primitives that can be combined to create rich, structured experiences.
Each block is designed to represent a specific pattern of structured data, such as entity lists, callouts, tabs, tables, and more. These blocks are purpose-made generative UI - so they are optimized for flexibility and composability. Whether you're displaying "Things to do in Paris" or a complex data-rich interface, blocks provide a consistent, scalable foundation that keeps generated UI clean, predictable, and easy to evolve.
How to compose
Composition is how individual blocks come together to form complete interfaces.
AI is responsible for assembling blocks based on its understanding of the content and context. Given structured data and intent, the model selects the blocks that best fit the information hierarchy and user experience. This allows interfaces to be generated dynamically while still maintaining strong visual and structural consistency.
However, this behavior is not a black box, you remain in control.
You can guide composition through system prompts and usage rules, for example:
- defining when a particular block should be preferred
- specifying which block to use for specific contexts
- discouraging blocks in specific contexts
Understanding configurations
Many OpenUI blocks expose configurations that control their children elements and appearance. These configuration surfaces allow a single block to support multiple variations without requiring separate components.
By default, the system intelligently selects the configuration that best fits the generated context. This keeps outputs adaptive and reduces the need for manual tuning in most cases.
When more control is needed, you can explicitly steer configuration selection through your system prompts. This approach preserves the flexibility of generative UI while giving you precise control where consistency or requirements demand it.