Introduction

Blutui AI Components accelerates the development of your Blutui site by enabling you to generate custom components. This facilitates easy editing within Canopy, Blutui's site editing interface.

Prerequisites

Getting started

1

Access Blutui AI Components

  • Navigate to Blutui AI Components.
  • If you don't have an account, create a Blutui login by signing up on the AI app.
2

Generate Components

Once logged in, you can start typing the description of the component you want to generate in the Generate Component textbox.

Optionally, you can choose a component from the available bubbles.

Blutui AI Components textbox

After describing your desired component, click the submit icon. Your component will now be generated.

Prompt

Build a gallery component

Generated Component

3

Refine Your Components

After generating your component, you can iterate and refine it to better suit your needs.

Prompt

Make the component pink themed and change the title to "Our Workshop"

Refined Component

You can keep refining your component until you are happy with it.

4

Using your generated component in a Blutui project

Copy the generated component code by clicking on the Code tab in the generated component's top-right corner and copy the generated code.

Generated Code

Open your Blutui project and paste the code.

Paste Code on Blutui project

View the changes.

Canopy preview

Additional Resources

Conclusion

You've now successfully integrated AI Components with your Blutui project.

Was this helpful?