# How to Add Angular Material CSS and Customize the Header Bar of Dashboard Using CSS

**URL:** <https://community.cumulocity.com/t/how-to-add-angular-material-css-and-customize-the-header-bar-of-dashboard-using-css/4037>\
**Category:** Forum\
**Tags:** cumulocity\
**Created:** [April 12, 2023, 1:04pm UTC](https://community.cumulocity.com/t/how-to-add-angular-material-css-and-customize-the-header-bar-of-dashboard-using-css/4037 "2023-04-12T13:04:52Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![AshwinV](https://avatars.discourse-cdn.com/v4/letter/a/f08c70/32.png) [@AshwinV](https://community.cumulocity.com/u/AshwinV)\
**Post date:** [April 12, 2023, 1:04pm UTC](https://community.cumulocity.com/t/how-to-add-angular-material-css-and-customize-the-header-bar-of-dashboard-using-css/4037/1 "2023-04-12T13:04:52Z")

</div>

#### _Product/components used and version/fix level are you on:_

Cumulocity Trial Version

#### _Detailed explanation of the problem:_

Hello Everyone,  
I am using an Application Template of c8ycli, in which I have to install Angular Material, but the CSS of the Material is not applying to my components.

The only way I found is to apply it from c8y modules which are present under node\_modules, Is there any other way I can apply the CSS without going into the node modules

Also, I want to apply CSS to the Header of the Dashboard, but that too I need to apply from styles of c8y modules present under node\_modules.

Is there any other way I can apply my css without going to node\_modules?

#### _Error messages / **full error** message screenshot / log fileL_

#### _Is your question related to the free trial, or to a production (customer) instance?_

#### _Have you installed all the latest fixes for the products and systems you are using?_

---

<div class="post-metadata">

**Author:** ![Felix.Schaede](https://avatars.discourse-cdn.com/v4/letter/f/c4cdca/32.png) [@Felix.Schaede](https://community.cumulocity.com/u/Felix.Schaede)\
**Post date:** [April 12, 2023, 3:31pm UTC](https://community.cumulocity.com/t/how-to-add-angular-material-css-and-customize-the-header-bar-of-dashboard-using-css/4037/2 "2023-04-12T15:31:59Z")

</div>

Hi Ashwin,  
in the c8ycli tutorial application you can find an example how to add your own LESS elements to an application. You need to add a “brandingEntry” to the package.json with the path to your .less file.

Hope this helps,  
Felix

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/system/32/31990_2.png) [@system](https://community.cumulocity.com/u/system)\
**Post date:** [October 9, 2023, 3:32pm UTC](https://community.cumulocity.com/t/how-to-add-angular-material-css-and-customize-the-header-bar-of-dashboard-using-css/4037/3 "2023-10-09T15:32:14Z")

</div>

Closed on October 9, 2023, 3:32pm UTC

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.