> ## 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.
# Blocks
export const PaletteIcon = props => {
return
;
};
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](/design/design-system/style-guides) or a [Theme](/design/design-system/themes) 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.