how to change background color inside a confluence (Layout) section
Asked by Alex Kulichkov:

Hello Everyone!

We have a need to modify Background color of a layout section in confluence page.

We are working on a page design and Panel macro seems a bit crude (Even though i'm able to use CSS to set Header and body color if needed)


Answers:
author: veudiniz
body: Hi Alex, Try read here...see it solve your question.

[https://marketplace.atlassian.com/apps/247/content-formatting-macros-for-confluence?hosting=server\&tab=reviews](https://marketplace.atlassian.com/apps/247/content-formatting-macros-for-confluence?hosting=server&tab=reviews)

comments: author: Alex Kulichkov
body: Thanks for the answer!

I'm aware of this plug-in, but our use case is in prototype page, so we can't justify 7200$ just for POC that is not approved yet.

I would assume we should be able to include some css formatting into the layout section, but im not sure how to do it with native functionality.


author: JR
body: In reading the documentation ( <https://confluence.atlassian.com/doc/styling-confluence-with-css-166528400.html> ), it seems the ability to format the page with CSS has to enabled by the site administrator--

I'm also in the process of trying to solve this issue-- not entirely sure if I'm on the right path because I don't even know what version of the software I'm using.


author: Patricia Modispacher _appanvil_
body: Hey there [@Alex Kulichkov](/t5/user/viewprofilepage/user-id/4408570) ! I know this question was a while back, but it might still be relevant for you (or maybe someone else is facing the same challenge). ??

Here's the deal: Confluence doesn't have a built-in way to change the background color of a layout section directly. But there's a [**free add-on called Karma**](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social) that can help you out.

**[Karma](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social)** offers pre-designed templates and layouts, many of which include customizable backgrounds. You can explore the available templates and see if one suits your design needs.?

|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| [![iScreen Shoter - 20240423142509309.jpg](https://community.atlassian.com/t5/image/serverpage/image-id/320037i337153ECB15C02E1/image-size/large?v=v2&px=999 "iScreen Shoter - 20240423142509309.jpg")](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social) | [![iScreen Shoter - 20240423142523453.jpg](https://community.atlassian.com/t5/image/serverpage/image-id/320038i0B635972D385055A/image-size/large?v=v2&px=999 "iScreen Shoter - 20240423142523453.jpg")](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social) |
| [![iScreen Shoter - 20240423142550724.jpg](https://community.atlassian.com/t5/image/serverpage/image-id/320039i2B1E32C8B7CDF877/image-size/large?v=v2&px=999 "iScreen Shoter - 20240423142550724.jpg")](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social) | [![iScreen Shoter - 20240423142459664.jpg](https://community.atlassian.com/t5/image/serverpage/image-id/320040iA161F2CD449CE9D4/image-size/large?v=v2&px=999 "iScreen Shoter - 20240423142459664.jpg")](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social) |

Additionally, Karma allows some level of customization within templates, so you might be able to modify the background color within a chosen template.

Here's a link to [**Karma on the Atlassian Marketplace.**](https://marketplace.atlassian.com/apps/1228839?utm_campaign=community_question_background_color&utm_source=atlassian-community&utm_medium=social)  

And if you are looking for a pro-level of support for your Confluence page design needs, you can simply **[fill out this form](https://docs.google.com/forms/d/e/1FAIpQLSf-s9T9GcjbjEdwnliqFpjujqPiSSzOqOt3WH91sn_Dv9nqwQ/viewform)** to take part in the great format [**"Pimp My Site".**](https://youtube.com/playlist?list=PLKB9mHgXrY0wjOcci8omJs1nAwLN8O0pZ&si=y0I5vcOIe4Ct30DU) Companies like Released and Appfire have taken part already. Maybe you will be next.


author: John_Morales
body: every solution is a custom plugin and costly over time..... !!!! UGH !!!


author: Helene Roberts
body: If you have a page with the old Confluence editor from OnPrem you kan use the panel macro to nest macros and change background, really miss the old editor and the freedom it gave to style pages as i liked.

Now i am copying old page/editors, when i need the funktion........


author: sekhar reddy
body: Hi [@Alex Kulichkov](/t5/user/viewprofilepage/user-id/4408570)

By using panel macros we can add colors to a particular section in a confluence page in cloud environment, I am not sure whether these are available in server/Data center versions.![pannel macros.PNG](https://community.atlassian.com/t5/image/serverpage/image-id/233116i25D498D7A35DF73D/image-size/large?v=v2&px=999 "pannel macros.PNG")

comments: author: Tonie Borchardt
body: I'm looking for this right now. These panels take text only. So if you're trying to put a background under child pages or other similar navigation it will not go on top of the panel. You need to be able to color an actual panel or move a table where you want it and color that, it seems.


author: Franz Reichard _Communardo_
body: Hello [@Alex Kulichkov](/t5/user/viewprofilepage/user-id/4408570) ,

thank you for your question.

[CUTE for Confluence](https://marketplace.atlassian.com/apps/1211097/cute-for-confluence) gives you a powerful toolbox for customizing your intranet. Now you can easily add your corporate branding, upgrade your UI, and deliver a user experience that's uniquely your own.

* With CUTE, it just takes a few clicks to add your company logo, customize color palettes, and seamlessly integrate Confluence with your other digital properties
* All theming is applied via extensions, giving you the power to fully customize Confluence without digging into source code or worrying about upgrade compatibility
* Our [library of sample extensions](https://communardo.atlassian.net/wiki/spaces/cute/pages/27870005/Extensions+for+Confluence) offers customizable themes, headers, menus, sidebars, dashboards, and more---everything you need to build create an amazing intranet experience
* CUTE extensions are compatible with all versions of Confluence, so you can rest easy knowing that your intranet will work seamlessly with the next Atlassian update

If you have further questions or support requests you can also contact [our support](https://jira.communardo.de/servicedesk/customer/portal/2) directly.

Kind regards,

Franz  
Communardo Support


author: Nayereh Keramatnezhad
body: Hi. maybe this add on can help you

<https://marketplace.atlassian.com/apps/1210932/cute-for-jira>

comments: author: Alex Kulichkov
body: Hi Nayereh,

Thank you for the suggestion, but we'll face similar issue as with content-formatting suggestion, 5200$ is hard to justify at the moment.


author: bill_bailey
body: Why not create a user macro to do what you want? You just have all the content surrounded by a styled div tag.

comments: author: Alex Kulichkov
body: Do you have template or something to start with? i'm more involved with process and change management.


Tags: confluence-server

server