How it works Features Themes Teams Case studies Pricing Help Careers Sign in Build my AI assistant free
Dashboard AI Assistants Team assistant Knowledge library Team Profile Help
Theme

Design 5 min read Every plan (all 10 templates and themes on paid plans)

Make your assistant look like your brand

Choose a template and colour theme, place the launcher button, pick its icon and set the look and feel, with a live preview of the real widget as you go.

You'll need
Nothing. Your brand is already detected
Time
Five minutes
Where
AI Assistants → your assistant → Appearance

While it was learning your website, owns.ai also studied its design (your fonts, corners, buttons and colours) and designed a chat window to match. You can keep that, fine-tune it, or choose from ten templates and ten colour themes. Everything on the right of the Appearance tab is the real widget, so you can chat with it while you design.

1. Pick a template

A template is the layout: how messages are presented, the typography and the shapes. Your website's design (marked AI-designed) is selected for you. The others are:

  • Classic: the floating card. Messenger: phone-style chat.
  • Editorial: serif type, answers set like an article. Terminal: a developer console.
  • Side drawer: a full-height panel. Spotlight: a centred command palette (Ctrl/Cmd + K).
  • Thread: team-chat rows. Bold: heavy outlines and hard shadows.
  • Playful: a scalloped header and bouncy motion. Concierge: a welcome card with your greeting and questions, folding into a bar once the chat starts.
The Appearance tab showing templates on the left and the live preview on the right
Templates on the left, the real widget on the right. Changes show instantly.

2. Choose a colour theme

A theme is colour only, so any theme works with any template. Your brand uses the colours sampled from your website; the others are Aurora, Midnight, Bubble, Executive, Sunset, Forest, Graphite, Latte and Lagoon. Choose Your brand and you can adjust each colour individually.

Colour theme cards including Your brand, Aurora and Midnight
Ten colour themes plus your own brand palette.

3. Place the launcher and choose its icon

The launcher is the button that opens the chat. Under Position on your website, pick one of eight spots: bottom right (the default), bottom left or centre, top left, centre or right, or middle left or right. Choose a spot that doesn't cover your own "Book now" or cart button.

For the button icon, keep the same icon as your assistant's avatar or search more than 3,000 icons by name, for example tooth, wrench or calendar.

The launcher position grid and the icon picker
Eight positions and a searchable icon library.

4. Finish with look & feel

  • Shape: rounded square (the default), square or circle, used for the avatars and the launcher.
  • Glass: from off to "crystal", it turns the chat window to frosted glass while keeping the text panels readable.
  • Greeting and starter questions: the first message visitors see and the questions offered as one-tap buttons. Use the questions your customers really ask.
  • Under each answer: show the sources and follow-up suggestions, or fold them behind small "Sources" and "Suggestions" buttons.

5. Save & publish

Press Save & publish in the bar at the bottom. The change is live on your website straight away; there's nothing to re-install. Changed your mind? Discard puts everything back to the last published version.

The Free plan includes the AI design, your brand palette and two templates and themes. Starter and above unlock all ten of each. Compare plans.

Was this guide helpful?

Keep going