Generating a Theme Using AI

The AI-powered theme generator leverages Kajoo Gen AI to create an entire design system based on your input; whether it’s a prompt, an image, or a screenshot of your website.

1. Access the AI Generator:

Navigate to the Generate Theme button within your theme editor.
Here, you can initiate the AI-based theme generation process.

2. Provide Input:

Prompt or Screenshot:

You can either type in a detailed prompt describing your desired design aesthetic or upload a screenshot/mockup of your website.
Optionally, attach color palettes or any other reference materials.

3. Theme Generation:

The AI will process your input and generate a full set of design tokens, including colors, fonts, tokens, and elements.

Preview the generated theme. The preview typically includes:

A complete color palette.
Suggested typography and font sizes.
Basic styling for elements and components.

4. Import and Integration:

Once satisfied with the AI-generated theme, click Import.
The generated tokens will be added to your existing design system. Note that generating a theme via AI will add to the current design tokens rather than overwrite them.

5. Post-Generation Tweaks:

Review each generated variant. You can rename, set a variant as default, or delete unwanted variants.
You can also rename the theme if necessary using the field at the top of the editor.
Ensure that the generated tokens align with your design vision before finalizing.

Benefits

Creativity Boost: Use AI to quickly generate a design system that serves as a starting point.
Customization: Tweak the generated tokens to better fit your brand identity.
Integration: Easily merge AI-generated tokens with your pre-existing design tokens without losing any work.