Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.kombai.com/llms.txt

Use this file to discover all available pages before exploring further.

Design Mode is currently in beta. For feedback, please contact us at support@kombai.com.
A Block is an entire design or a specific section of a design, stored in a separate Canvas for reuse. Blocks let you extract and preserve UI patterns, like a navigation bar, a card layout, or a hero section, independently of the original Canvas they came from.

When to use Blocks

Use Blocks when you have a UI pattern that you want to reuse across multiple Canvases or share as reference context in chat. Common scenarios include:
  • You have a navigation bar, footer, or card layout that should stay consistent across different pages or projects.
  • You want to reference an existing design section when prompting Kombai to generate something new — for example, attaching a saved header Block and asking Kombai to match its style in a new page.
  • You want to extract and preserve a section of a design before experimenting with changes, so you can always refer back to the original.
If you only need to control the visual style (colors, typography, spacing) rather than reuse a full UI structure, use a Style Guide or a Theme instead.

Save a Block

To save a Block, open the Blocks sidebar by clicking the icon on the left toolbar, then click the + icon. You will see two options:
Use this when you want to save a specific section of a design, such as a header, a card, or a sidebar.
  1. Click the icon on the left toolbar, then click + and select Design element.
  2. Click on the design that contains the section you want to save.
  3. Hover over the design to reveal the section selector. When the section you want is highlighted, click it.
  4. Select a Target canvas. If you don’t already have a Canvas, click Create new canvas, add a name for your canvas and click Create.
  5. Click the Create Block button.
Use this when you want to save an entire design as a Block.
  1. Click the icon on the left toolbar, then click + and select Design.
  2. Click on the design you want to save.
  3. Select a Target canvas. If you don’t already have a Canvas, click Create new canvas, add a name for your canvas and click Create.
  4. Click the Create Block button.

View a Block

Each saved Block has a dedicated Canvas. You can open it directly from the Blocks sidebar to inspect or edit its contents.
  1. Click the icon on the left toolbar.
  2. On the Block card you want to view, click the View Block button. The Block’s Canvas will open.

Attach Blocks in chat

There are two ways to attach a Block to the chat as context:
  1. Switch to Design Mode from the modes dropdown in the chat input box.
  2. Click the icon in the chat input to open the Design System popover.
  3. Switch to the Blocks tab.
  4. Select the Block you want to attach to the chat as context.
  1. Type @Blocks in the chat input.
  2. Select the Block you want to attach.
  3. Type your prompt and send.