userChrome.css
1 /* Catppuccin Mocha Mauve userChrome.css*/ 2 3 @media (prefers-color-scheme: dark) { 4 :root { 5 --zen-colors-primary: #313244 !important; 6 --zen-primary-color: #cba6f7 !important; 7 --zen-colors-secondary: #313244 !important; 8 --zen-colors-tertiary: #181825 !important; 9 --zen-colors-border: #cba6f7 !important; 10 --toolbarbutton-icon-fill: #cba6f7 !important; 11 --lwt-text-color: #cdd6f4 !important; 12 --toolbar-field-color: #cdd6f4 !important; 13 --tab-selected-textcolor: rgb(204, 190, 246) !important; 14 --toolbar-field-focus-color: #cdd6f4 !important; 15 --toolbar-color: #cdd6f4 !important; 16 --newtab-text-primary-color: #cdd6f4 !important; 17 --arrowpanel-color: #cdd6f4 !important; 18 --arrowpanel-background: #1e1e2e !important; 19 --sidebar-text-color: #cdd6f4 !important; 20 --lwt-sidebar-text-color: #cdd6f4 !important; 21 --lwt-sidebar-background-color: #11111b !important; 22 --toolbar-bgcolor: #313244 !important; 23 --newtab-background-color: #1e1e2e !important; 24 --zen-themed-toolbar-bg: #181825 !important; 25 --zen-main-browser-background: #181825 !important; 26 --toolbox-bgcolor-inactive: #181825 !important; 27 } 28 29 #permissions-granted-icon { 30 color: #181825 !important; 31 } 32 33 .sidebar-placesTree { 34 background-color: #1e1e2e !important; 35 } 36 37 #zen-workspaces-button { 38 background-color: #1e1e2e !important; 39 } 40 41 #TabsToolbar { 42 background-color: #181825 !important; 43 } 44 45 .urlbar-background { 46 background-color: #1e1e2e !important; 47 } 48 49 .content-shortcuts { 50 background-color: #1e1e2e !important; 51 border-color: #cba6f7 !important; 52 } 53 54 .urlbarView-url { 55 color: #cba6f7 !important; 56 } 57 58 #zenEditBookmarkPanelFaviconContainer { 59 background: #11111b !important; 60 } 61 62 #zen-media-controls-toolbar { 63 & #zen-media-progress-bar { 64 &::-moz-range-track { 65 background: #313244 !important; 66 } 67 } 68 } 69 70 toolbar .toolbarbutton-1 { 71 &:not([disabled]) { 72 &:is([open], [checked]) 73 > :is( 74 .toolbarbutton-icon, 75 .toolbarbutton-text, 76 .toolbarbutton-badge-stack 77 ) { 78 fill: #11111b; 79 } 80 } 81 } 82 83 .identity-color-blue { 84 --identity-tab-color: #89b4fa !important; 85 --identity-icon-color: #89b4fa !important; 86 } 87 88 .identity-color-turquoise { 89 --identity-tab-color: #94e2d5 !important; 90 --identity-icon-color: #94e2d5 !important; 91 } 92 93 .identity-color-green { 94 --identity-tab-color: #a6e3a1 !important; 95 --identity-icon-color: #a6e3a1 !important; 96 } 97 98 .identity-color-yellow { 99 --identity-tab-color: #f9e2af !important; 100 --identity-icon-color: #f9e2af !important; 101 } 102 103 .identity-color-orange { 104 --identity-tab-color: #fab387 !important; 105 --identity-icon-color: #fab387 !important; 106 } 107 108 .identity-color-red { 109 --identity-tab-color: #f38ba8 !important; 110 --identity-icon-color: #f38ba8 !important; 111 } 112 113 .identity-color-pink { 114 --identity-tab-color: #f5c2e7 !important; 115 --identity-icon-color: #f5c2e7 !important; 116 } 117 118 .identity-color-purple { 119 --identity-tab-color: #cba6f7 !important; 120 --identity-icon-color: #cba6f7 !important; 121 } 122 123 hbox#titlebar { 124 background-color: #181825 !important; 125 } 126 127 #zen-appcontent-navbar-container { 128 background-color: #181825 !important; 129 } 130 }