# Chat look customization

**URL:** <https://meta.discourse.org/t/chat-look-customization/250955>\
**Category:** Development\
**Tags:** chat\
**Created:** [January 6, 2023, 5:03pm UTC](https://meta.discourse.org/t/chat-look-customization/250955 "2023-01-06T17:03:48Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![agf1997](https://avatars.discourse-cdn.com/v4/letter/a/977dab/32.png) [@agf1997](https://meta.discourse.org/u/agf1997)\
**Post date:** [January 6, 2023, 5:03pm UTC](https://meta.discourse.org/t/chat-look-customization/250955/1 "2023-01-06T17:03:48Z")

</div>

I’m trying to customize the new chat window (full screen mode) on desktop.

I have the css I’d like to use, but I can’t figure out where to put it in my theme to have it take effect.

I’ve tried …

```plaintext
my_theme/desktop/chat.scss
my_theme/desktop/chat_desktop.scss
my_theme/common/chat.scss
my_theme/common/chat_desktop.scss

```

None of those seem to override the default css.

For completeness, here’s the css I’m trying to inject.

```plaintext
// Adjust full screen chat appearance

.full-page-chat .chat-full-page-header {
	background: var(--primary-very-low);
}

.full-page-chat .chat-full-page-header {
	border-top: 0px;
}

:root {
	--d-max-width: 2000px;
}

.has-full-page-chat:not(.discourse-sidebar) {
	--max-chat-width: 2000px;
}

#main-outlet-wrapper {
	padding: 0 0px;
}

```

---

_[View the full topic](https://meta.discourse.org/t/chat-look-customization/250955)._