CSS to change color of pinned tab

I’ve applied this CSS to make pinned tabs narrower ( Shrink the size of pinned tabs - Feature requests - Obsidian Forum).

I’ve removed the pin icon to get more “note name”, but it would be nice to change the color of the pinned tab.

Any tips on how to do this?

Something like this maybe? Added a bit to the linked snippet:

.workspace-tab-header:has(.mod-pinned) {
  /* shrink if pinned */
  max-width: 60px !important;
  /* background color of pinned tab(s) */
  background-color: darkslategray;
  --tab-curve: 0;

  /* also hide the title of pinned tabs */
  & .workspace-tab-header-inner-title {
    display: none;

the color can be a gray, a hex, a rgb, etc., value.

1 Like

Thanks, that hit the spot!
I had to add “!Important” to the background-color to force a change, which then overrides the accent color, but that’s not a big problem - the unpinned tabs still have it. And I can still tell which pinned tab is active because the text is brighter (setting in Minimal theme).

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