Transparency on Linux

[sant123]

Hi, not sure if this is expected behavior but in Visual Studio Code there is no transparency in the files tab.

Zed

Code

Thanks

[sant123]

I'm using Fedora 40

[sant123]

Tested on Mac and works good

[lsunsi]

Same here! Just installed it on Linux and transparency was definitely unexpected.

Edit: I'm also on Fedora 40, wayland.

[black-puppydog]

Running debian unstable with latest updates from today, on X11 and an AMD Vega mobile GPU. Transparency in the sidebar makes it pretty unusable. For the time being, this is gonna be my ownly non dracula themed editor 😢

[smallSwed]

I have the same transparency issue on Ubuntu 24.04 with wayland.

[Otterpocket]

  "experimental.theme_overrides": {
    "background.appearance": "opaque"
  },

Try putting this in the settings file.

[Otterpocket]

Also, sorry for taking so long to respond.... GitHub notifications..

Ok so I can explain what is happening but not why.

A feature got released in zed to accommodate for transparent/blurred UI, by adding the setting above with one of the values: opaque, blurred or transparent. For these features to do anything, parts of the theme (such as the project panel) need a 8 digit hex notation to define transparency. This should only come into effect when blurred or transparent are set. This has been part of the theme for quite a while now and has always worked well on Mac.

So my conclusion is that this is more of a bug with the linux release than the theme itself.

I'll look for any bug reports on the zed repo and link them here.

[lsunsi]

@Otterpocket I just tried it, but it looks the same. Maybe I'm not placing it right

[lisotton]

I'm also having this issue. I'm on Pop_OS 22.04. I tried the solution provided by @Otterpocket, but did not work.

[dnikoloski]

I am affected by this on Bluefin, fixed with this:

  "experimental.theme_overrides": {
    "background": "#282a36ff",
    "title_bar.background": "#141119"
  }

[smallSwed]

I am affected by this on Bluefin, fixed with this:

  "experimental.theme_overrides": {
    "background": "#282a36ff",
    "title_bar.background": "#141119"
  }

this is a good workaround, not 100% because when the Zed is out of focus the title bar and the status bar still transparent, but those can fixed also this way:

{
  "experimental.theme_overrides": {
    "background": "#282a36ff",
    "title_bar.background": "#141119ff",
    "title_bar.inactive_background": "#1c1d26ff",
    "status_bar.background": "#141119ff"
  }
}

[alvinseptiano]

I'm currently using Ubuntu, my workaround for this by pressing Windows / Super + M key. Update: I make alternative version of dracula. here https://github.com/alvinseptiano/dracula_zed

[Otterpocket]

This was in the latest preview release, does it resolve this issue? Here

[smallSwed]

unfortunately no, the side bar and the title bar still transparent:

[Otterpocket]

unfortunately no, the side bar and the title bar still transparent:

and:

  "experimental.theme_overrides": {
    "background.appearance": "opaque"
  },

still doesn't work?

[smallSwed]

nope, it does not work. It seems like that setting is ignored, nothing changes when setting to any of the valid values ("opaque", "transparent" or "blurred")

[zero-stacks]

unfortunately no, the side bar and the title bar still transparent:

and:

  "experimental.theme_overrides": {
    "background.appearance": "opaque"
  },

still doesn't work?

mine is working i guess(fedora 40/wayland/KDE)

using this in settings.json:

"experimental.theme_overrides": {
    "background": "#282a36ff",
    "title_bar.background": "#141119ff",
    "title_bar.inactive_background": "#1c1d26ff",
    "status_bar.background": "#141119ff",
    "background.appearance": "opaque"
  },

[lisotton]

The suggestion from @JonasAlv worked for me.

[Otterpocket]

Yes, Overriding the colours will certainly work as a temporary fix. I'll leave this ticket open until the actual source of the problem is fixed

[smallSwed]

I checked out the dracula.json and found this: https://github.com/dracula/zed/blob/c60784cf4d98d2e3e657218916e92196199d5b8a/themes/dracula.json#L40

Why is the title_bar.background and others have transparency? "status_bar.background": "#141119bb", "title_bar.background": "#141119bb",

I think that is the source of the problem.

[Otterpocket]

I checked out the dracula.json and found this:

https://github.com/dracula/zed/blob/c60784cf4d98d2e3e657218916e92196199d5b8a/themes/dracula.json#L40

Why is the title_bar.background and others have transparency? "status_bar.background": "#141119bb", "title_bar.background": "#141119bb",

I think that is the source of the problem.

That's meant to be there for the blurred and transparency feature to work at all. The problem is the feature doesn't work properly on linux. The linux version was released after the transparency feature was introduced.

This is what it should look like. (Mac)