Panels are used to highlight important information and organize content on a page. They help draw attention to key messages, separate sections clearly, and make it easier for users to scan and navigate.

1. Open the desired page or create a new one.

2. Enter edit mode, then click the ‘+’ icon in the toolbar or press ‘/’ on the keyboard to open the module menu.

3. In the search bar, type “Viz” or “Optics” and select it from the list to open the configuration dialog. Alternatively, type “Panel” and select the Viz (by Optics).

4. In the configuration dialog, either select a module template from the overview page or navigate to Panel from the left sidebar.

Open

Creating panels starts with choosing a template: Standard, Notification, Custom Icon or Emoji. Each one is crafted by our design experts to help you build outstanding, consistent content in Confluence. We’re continuously adding new templates to keep your pages fresh and visually engaging.

Open

Panels offer flexible settings to adjust appearance and behavior based on the use case.

Open

Panel elements such as icon, title and subtext can be enabled or disabled, providing flexibility to adapt panels to different use cases. Available elements vary depending on the selected panel template.

While panels can be edited inline, the right sidebar also provides full access to content settings. It adjusts based on the selected template and reflects the visibility of options set in Global Settings. Panels support three types of visual elements:

• Emoji: Used to add personality and expressiveness to panels, making content feel more engaging and friendly.

• Icons: Available from four built-in libraries, offering a wide variety of styles to suit different use cases, from playful to professional.

• Logos: Part of a dedicated feature connected to the Caelor Style guide. Allows Confluence admins to upload, manage, and use approved company logos across panels and other modules.

Global styling options include corner rounding and color customization. The color picker follows a two-color scheme with accent and text colors to ensure visual consistency across light and dark modes, and to align with the overall design system. Available colors are defined in the Caelor Style guide to maintain consistency across all formatting modules.

When Color mute is enabled, the accent color is applied to all elements, including the background with reduced opacity. In this mode, text color settings are disabled.

Open