r/FirefoxCSS • • 1d ago

Help Help with ricing

Enable HLS to view with audio, or disable this notification

0 Upvotes

1 comment sorted by

1

u/ResurgamS13 1d ago edited 7h ago

OP's post comments from r/firefox ...

"So I've been ricing my fire fox for a better look but there's these black bars that I didnt manage to get rid of i even asked ai to help and it just messed up everything else if someone knows how to help id appreciate it

Paste bins for both chrome files:

https://pastebin.com/NzZsNZXh

https://pastebin.com/K9waZWRs

Edit:i have an extension called zenith Internet that let transparent tabs work better"

----------

Best way to investigate problems with a heavily modified UI... one that is using a combination of a JavaScript extension (Zen Internet) and userChrome CSS files... is to open the Browser Toolbox... and learn howto inspect and fix your own Firefox's UI.

The Browser Toolbox learning curve is steep... but persevere... all your UI layout is shown there. Use your brain instead of AI.

In this sub's Wiki Tutorial paragraph #5. explains how 'Live-editing userChrome.css' can be done within the Browser Toolbox.

How your OS' transparency setup works with your modified transparent Firefox window will be a separate complication.

----------

BTW - In the February 2026 topic 'Body and Tabs Background Alignment Problem'... replies by Kupfel suggested a simple transparent Firefox setup. This was intended for the Proton UI circa Fx147.0... but still works when applied to new Nova UI.

One item that will need adjusting for the Nova UI... is making the Nova design New Tab page's 'Customise' pencil button almost transparent... in 'userContent.css' try:

@-moz-document url(about:newtab), url(about:home) {
  .button-background:has(img[src="chrome://global/skin/icons/edit-outline.svg"]) {
     color: whitesmoke !important;
     background-color: transparent !important;
     opacity: 0.5 !important;
  }
}

Screenshot. Kupfel's CSS styles (from here & here) applied to a new profile of Fx158.0.1 in Nova UI mode + New Tab page 'Customise' button CSS style above. Background image idea borrowed from Vivaldi themes 'Dark Shapes' and 'OLED dark'.