# TUTORIAL – Change section, page, or project background color

**URL:** <https://community.weweb.io/t/tutorial-change-section-page-or-project-background-color/238>\
**Category:** Tutorials\
**Tags:** custom-css, background-color\
**Created:** [February 16, 2022, 11:43am UTC](https://community.weweb.io/t/tutorial-change-section-page-or-project-background-color/238 "2022-02-16T11:43:26Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![aurelie](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/aurelie/32/13249_2.png) [@aurelie](https://community.weweb.io/u/aurelie)\
**Post date:** [February 2, 2023, 10:18am UTC](https://community.weweb.io/t/tutorial-change-section-page-or-project-background-color/238/4 "2023-02-02T10:18:02Z")

</div>

Internally we use css variable with id, so its doable, but a bit tricky to obtain these id at the moment.

Two hacks to get these ids:

- Open any formula, and bind this to your colors. Switch to js, and the id will be display. Then you can use var(–YOUR\_ID) on your css style.  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/8/8dcb53c83d4c703edb7bc604df5980e4e354097d.png)
- Open the devtool on your editor, and search for the html element (the one from the iframe if you are in the editor). You will see a bunch of css variable defined here, including your colors.  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/5/5686ca4d4d4226532567a815068f5490d3dc68da.png)

Hope this help !

---

_[View the full topic](https://community.weweb.io/t/tutorial-change-section-page-or-project-background-color/238)._