MESSENGER UNLEASHED

Professional Theme Designer for Desktop

Repo

Presets

OLED / Darker

Pastel / Alive

Pro Palette

Styles

Left Sidebar

#000000

Chat List

#121212

Main Background

#1e1e1e

Sent Bubble

#2979FF

Received Bubble

#3a3a3a

Accent Color

#0084ff

Text Primary

#ffffff

Text Secondary

#b0b0b0

Export CSS

/* mycustomtheme */
:root { color-scheme: dark; }

/* Backgrounds */
html, body, div[role="main"], div[role="navigation"], div[role="complementary"], div[aria-label="Chats"], div[role="banner"] {
  background-color: #1e1e1e !important;
  color: #ffffff !important;
}

div[role="navigation"] {
  background-color: #000000 !important;
}

div[aria-label="Chats"], div[aria-label="Chats"] > div {
  background-color: #121212 !important;
}

/* Bubbles */
div[role="none"] > div > div[dir="auto"] {
  background-color: #3a3a3a !important;
  color: #ffffff !important;
}

div[role="none"][data-testid="message-container-outgoing"] > div > div[dir="auto"],
div[role="none"] > div[style*="background-color: rgb(0, 132, 255)"] > div[dir="auto"] {
  background-color: #2979FF !important;
  color: #fff !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1e1e1e; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 4px; }

Alice Vance

Active 15 min ago

Alice Vance

You're friends on Messenger

Alice Vance

Hi! How is the new theme looking?

I think the colors are much better now.

It looks amazing!

12:45 PM

The preview is very helpful.

Glad you like it! Let me know if you need any more changes.

Instructions

Customize every part of the UI. Once ready, copy the CSS and paste it into Messenger's Custom CSS settings.

How to apply in Messenger Desktop

Open Settings

Go to Unleashed > Custom CSS in the app menu.

Create CSS

Select Add Custom CSS... (or Edit if you already have some).

Injection

Paste your generated CSS rules into the dialog and click OK.

Live Deploy

Your styles will be applied instantly without a reload.