AI and Rovo

Design patterns for AI and Rovo, the future of teamwork.
Banner for AI and Rovo page

Rovo brand and AI experiences

AI and Rovo experiences use distinct branding, styles, and labels to show when AI is at work. Clearly identify AI experiences to build trust and transparency.

Logo and icons

Use the Rovo logo and AI icons to represent Rovo and AI-powered features in designs. Logos are also available for download.

The Rovo logo is hexagonal with a multi-colored effect. AI icons use a sparkle on other common icons to denote AI, such as a chat bubble with a sparkle.

Telepointers

Use the telepointer to show when Rovo is working on the page, giving a clear visual cue that AI is in action.

Telepointer components represent Rovo. There's a text cursor, whiteboard cursor, or audio/microphone pointer. The telepointer label/background is always black (or white in dark mode) for Rovo to set it apart from users and teammates.

Use the AI generation component to display AI-created content in context. The AI footer provides a consistent disclaimer to clarify that the content is AI-generated.

AI generation and footer. Uses a colorful border to contain the AI response and content, with a footer that says 'Uses AI. Verify results.'

AI actions and prompts

Bring AI into specific tasks and contexts with cues, skills, and inline prompting. When designing an AI feature, make sure it supports the user's task or needs.

Rovo button and nudges

Use the Rovo button to open floating chat. Add nudges to surface helpful AI actions at the right moment.

The Rovo button is a black floating action button with the Rovo logo. A nudge appears as a tooltip-style prompt suggesting an AI action.

Rovo cues and prompt starters

Use Ask Rovo buttons to open the inline prompt. To suggest a helpful next step that opens a chat, add a prompt starter with the AI chat icon. For quick AI actions that happen outside of chat, use Rovo cues.

Rovo cues and prompt suggestions using default styled buttons with different icons/labels to show AI and Rovo actions. Ask Rovo buttons use the Rovo logo, chat prompts use the AI chat icon, and cues use other AI icons with a sparkle or star shape like summarize.

Skills tags

Use the skills tag to give users direct access to specific AI capabilities. Unlike general prompts, skills tags let users choose the exact action they want instead of leaving it up to Rovo.

Skills tags show the skill name in a grey tag or lozenge that starts with a slash.

Prompt inline

Use prompt inline to let users give direct commands to Rovo during content creation or editing.

Prompt inline is a floating prompt input with a round arrow submit button. It also has a create icon button and a microphone icon button next to the submit.

AI chat and conversation

Choose from full-page (AI create), sidebar, or floating chat layouts depending on the context of your design.

AI create

Use AI create for substantial creations, like generating entire pages, multiple Jira tickets, or full-scale whiteboards.

AI create is a full-page chat experience with a centered prompt input and suggested actions below it.

Use sidebar chat for AI conversations that stay anchored to the side of a page or other content view. This keeps the content unobstructed and lets Rovo use the page as context.

Sidebar chat is a vertical panel anchored to the side of the page, showing a conversation thread alongside the main content.

Use floating chat for a more modular, flexible chat window, ideal for dense interfaces like Jira where screen space is limited.

Floating chat opens when the floating Rovo button is selected. It's a contained chat interface that hovers over the page in the bottom corner.

Chat message cards

Use message cards in chats to summarize information, confirm actions, or provide clickable links to content like whiteboards, documents, or code.

Message cards appear as bordered containers within a chat, displaying summaries, action confirmations, or linked content like documents and whiteboards.

AI design resources

AI design patterns in Figma

AI design patterns in Figma

Browse components, tokens, and patterns for Rovo and AI designs.
Atlassians only
, (opens new window)

More AI patterns for Atlassians

More patterns are developing. Find the full list or reach the team for support at Rovo and AI patterns, (opens new window)

Was this page helpful?
We use this feedback to improve our documentation.

What's new

Featured2025
© 2025 Atlassian