When it comes to building a strong corporate identity, nothing beats the power of brand and colors. Incorporating these elements will create a sense of consistency throughout your intranet.
From your Confluence navigation bar, access Cosmos by selecting it from the Apps dropdown.
Within Cosmos, proceed to the Settings area.
In the Settings menu, locate and click on General Settings.
Within General Settings, click on the Brand and Colors tab.
This page is structured into different sections, including sidebar customization, page headers, colors, and rounding options. Each section will be explained in detail, guiding through the process of personalizing the Confluence environment to match organizational branding and style preferences.
Sidebar customization
Customizing the sidebar in your Confluence environment allows for a more branded and cohesive user experience. This section focuses on how to personalize the sidebar to reflect your organization's identity more accurately:
Update the company logo displayed in the portal to ensure consistent branding across your digital assets.
Define the appearance of icons in the sidebar.
Page Headers
The header images on Cosmos pages present an excellent opportunity for reinforcing company branding and creating a visually appealing intranet environment. This customization allows organizations to add their unique identity into every page, making the user experience more engaging and aligned with the company's aesthetic.
Within the settings page, admins can define the layout of these header images. The choices include setting the images to full width for a bold, expansive look or opting for a grid width layout, which offers a structured, segmented appearance.
It's important to note that changes to the background image and the content within page headers are made directly on the page itself.
We’ll walk you through Newsroom’s example, but this can be done for People Network and Space Station as well.
Steps to customize page headers
Locate and click on the Newsroom's icon in the sidebar.
Click the edit button located in the bottom right corner. This option is only visible to admins.
Select "Header Design" from the drawer.
Modify the title and subtitle as needed to match your content or branding requirements.
Navigate to the "Header background" and click "Edit header."
Select from the following options for your new header image:
Unsplash → Access a library of stock photos for high-quality imagery.
Link → Use a direct link to an image.
Attachments → Select from available attachments or choose a Confluence page to upload your new header image.
Color → Opt for a solid color or create a gradient for a simple background.
Confirm your customizations by saving the changes.
Colors
When it comes to personalizing your intranet with Cosmos, color plays an important role in creating a visually cohesive and brand-aligned environment. Two main options are available for customizing colors throughout your intranet, each affecting different elements:
The primary color enhances the intranet by coloring links, action buttons, and active sidebar icons to indicate the current page.
Admins have the option to customize spaces and label colors within News and Pages widgets of Cosmos, enhancing customization and visual clarity for these important components.
Corner radius
The radius feature in Cosmos allows customization of corner roundness on elements like people cards, news cards, and panels, affecting the intranet's look and feel. Adjusting corner radius is important for branding as it helps match the intranet's design with the organization's identity. Softer, rounded corners can make the interface feel more welcoming, while sharper corners give a sleek, professional appearance.
Cosmos allows for setting the corner radius up to 20px, providing flexibility in customising the visual impact of your intranet elements.