Blog de Design

Introducing Themes

Themes are collections of styles you can reuse across designs. They are available for you to edit manually and for Banani's AI to edit via prompts.

When creating a new project, you can choose between generating a new Theme or selecting from your previously created themes.

Customize Themes

Go to the Styles tab and see all of the details about the Theme and design tokens it has. Each color used within the design will be displayed there.

You can ask AI to change those colors or click on any color to adjust it yourself.

Import Existing Styles

You can also import your existing color palettes or brand styles. Simply paste HEX colors into the AI prompt or attach a reference image and ask Banani to copy its colors.

Banani is out of alpha! It's ready to help you move faster from idea to UI. We have 4 new major things YOU asked for, and many more quality of life improvements.

NEW UI-AI

• Prompts that used to generate junk now give quality results

• Complex multi-column layouts, landing pages, ANYTHING

• Designs appear in real-time, element by element

Partial Editing

• AI editing of a selected part of the design

• Ideal for making quick, precise tweaks

• Remove elements, change texts, etc.

Copy-Paste to Figma

• Select the screen in Banani

• Click "Copy to Figma"

• PASTE directly to Figma

Note: Works only with projects created this month, so try generating new projects!!

Image References

• Attach screenshots, wireframes, sketches, ACTUAL UIs

• Banani will copy the layout and content

• Great for redesigns, edits to existing product UI

What's Else New?

We've shipped multiple BIG updates in the past month that you might've missed. Here are some highlights:

• Faster AI response time

• Reworked screen+styles panel

• Easier navigation in large projects

• Snappier canvas

• Duplication of screens

• And more…