# How to hot change EUI distributed CSS file?

**URL:** <https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000>\
**Category:** Kibana\
**Created:** [June 4, 2021, 4:38pm UTC](https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000 "2021-06-04T16:38:10Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![danburi](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/danburi/32/89039_2.png) [@danburi](https://discuss.elastic.co/u/danburi)\
**Post date:** [June 4, 2021, 4:38pm UTC](https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000/1 "2021-06-04T16:38:10Z")

</div>

I have Kibana v7.10.2 on linux system.

Kibana loads CSS resource  
`http://localhost:5601/36136/bundles/kbn-ui-shared-deps/kbn-ui-shared-deps.v7.light.css`

the only relevant file can be found at:  
`./node_modules/@kbn/ui-shared-deps/target/kbn-ui-shared-deps.v7.light.css`

which I believe it is built from `./node_modules/@elastic/eui/dist/eui_theme_light.css`.

I sequencedly made some changes to both these files and daemon-reload and restart the service, but the changes are not reflecting on the browser.  
I don't see the `optimize` dir in `/usr/share/kibana/` but there is in `/usr/share/kibana/src/` - deleting this and restart the service will throw 'missing files' failure.

Is there a way to directly hot change the CSS file? I understand it can be done in dev mode and building distributable.. but it is time-consuming.

I'm also wondering how does Kibana bundle and serve these kinds of resources? even deleting `./node_modules/@kbn/ui-shared-deps/target/kbn-ui-shared-deps.v7.light.css` would make Kibana run normally...

---

<div class="post-metadata">

**Author:** ![tsullivan](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tsullivan/32/31077_2.png) [@tsullivan](https://discuss.elastic.co/u/tsullivan)\
**Post date:** [June 8, 2021, 8:36pm UTC](https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000/2 "2021-06-08T20:36:15Z")

</div>

No, there is not a way to make hot-changes to CSS code in Kibana. See the Github issue here to explain why: [Easy way to customize Kibana logo and theme · Issue #17879 · elastic/kibana · GitHub](https://github.com/elastic/kibana/issues/17879#issuecomment-673327112)

As for the 2nd part of your question, I am really not sure 😕 . I have found a team to ask, so we may get an update.

---

<div class="post-metadata">

**Author:** ![tylersmalley](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tylersmalley/32/8833_2.png) [@tylersmalley](https://discuss.elastic.co/u/tylersmalley)\
**Post date:** [June 8, 2021, 8:40pm UTC](https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000/3 "2021-06-08T20:40:52Z")

</div>

It sounds like you're running from a distribution - in that case, you probably just need to clear or disable your browser cache to see the changes.

That NPM package in particular is built from [kibana/packages/kbn-ui-shared-deps at master · elastic/kibana · GitHub](https://github.com/elastic/kibana/tree/master/packages/kbn-ui-shared-deps), but is static in the distribution.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [July 6, 2021, 8:41pm UTC](https://discuss.elastic.co/t/how-to-hot-change-eui-distributed-css-file/275000/4 "2021-07-06T20:41:45Z")

</div>

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