Add a Vibe Block from the Block Library to your page. You can find it in the "Other" category or right in the list of categories below Zero Block.

Enter a prompt in the input field to generate the block. Once your prompt is ready, click on the "Send" button or press Enter on your keyboard.

To select an AI model for code generation, click the model name below the input field.

To attach images for the AI to consider during generation, click the paperclip icon.

Click the question mark icon to view example prompts for generating a block or using them as a starting point for your own prompt.

Click any example prompt to use it.

You can also preview an example prompt as a live demo on a separate page, such as a cover page example.

To copy the generated block code, click "Take the code." The block will then be automatically added to your page.

Click "Apply prompt" to open the editor and modify your request. In the editor, you can also attach images or select a different AI model for generation.

Once the block has been generated, the AI chat will display a "Done!" message indicating that the block is ready to use. Below the prompt, you'll see the options to copy, regenerate, or delete it.

In the chat, you can expand the AI response to view and copy the code.

To see the full code, click "Code" in the top panel to open the editor, where you can manually edit it to further customize the block.

To get the best result, you can either regenerate the block code by refining your original prompt or enter a completely new request.

For example, you can simply describe what needs to be changed in the block, and the AI will update the code accordingly.

By default, the block shows the latest generated version. To view a previous version, click the eye icon. To apply it, click "Apply."

Using this option, you can switch between different versions of the block. To save your result, simply close the AI chat window.

To edit the block again after closing the chat, click the "Block Editor" button.

To edit any element in a generated block, click on it and a content editing popup will open.

Add your text in the content field, save the changes, and they will be displayed in the block.

To view and edit the code of a specific element, click the arrow icon.

If you need more convenience in editing the block code, click the code icon to open the editor.

Vibe Block has free request limits that are included in all pricing plans by default. The table below shows how many requests you can make every 12 hours and per month depending of your pricing plan.