Chrome/Chromium custom theme colors


KrazyLurt

KrazyLurt

Active member
Member
Local time
10:20 AM
Posts
74
OS
windows 11
I use my own custom theme, loaded as an extension. I was wondering if the black colors shown in the image below can be changed? It's the top left button, the G search button, and user icon on the far right.
And the most important, the bottom line separator from the toolbar and the webpage. I want the line removed or the same color as the main toolbar.

color.png

My manifest.json is as follows:

Code: 
{
   "author": "Krazy",
   "description": "Krazy",
   "manifest_version": 3,
   "name": "Krazy Slight Blue Tint",
   "theme": {
      "colors": {
         "bookmark_text": [ 193, 194, 199 ],
         "frame": [ 40, 41, 43 ],
         "frame_inactive": [ 40, 41, 43 ],
         "frame_incognito": [ 40, 41, 43 ],
         "frame_incognito_inactive": [ 40, 41, 43 ],
         "ntp_background": [ 23, 24, 26 ],
         "ntp_header": [ 45, 46, 48 ],
         "ntp_text": [ 205, 217, 229 ],
         "omnibox_background": [ 40, 41, 43 ],
         "omnibox_text": [ 205, 217, 229 ],
         "tab_background_text": [ 193, 194, 199 ],
         "tab_background_text_inactive": [ 193, 194, 199 ],
         "tab_background_text_incognito": [ 193, 194, 199 ],
         "tab_background_text_incognito_inactive": [ 193, 194, 199 ],
         "tab_text": [ 223, 224, 229 ],
         "toolbar": [ 0, 0, 0 ],
         "toolbar_button_icon": [ 193, 194, 199 ]
      },
      "images": {
         "theme_frame": "images/theme_frame.png",
         "theme_frame_inactive": "images/theme_frame.png",
         "theme_toolbar": "images/theme_toolbar.png"
      },
      "tints": {
         "background_tab": [ -1.0, -1.0, -1.0 ],
         "buttons": [ -1.0, -1.0, -1.0 ],
         "frame": [ -1.0, -1.0, -1.0 ],
         "frame_inactive": [ -1.0, -1.0, -1.0 ],
         "frame_incognito": [ -1.0, -1.0, -1.0 ],
         "frame_incognito_inactive": [ -1.0, -1.0, -1.0 ]
      }
   },
   "update_url": "https://clients2.google.com/service/update2/crx",
   "version": "1.0.2"
}
 

My Computer

System One

  • OS
    windows 11
That pretty much covers what you can customize in theme manifest file. Mostly limited to colors and images, UI icons cannot be altered there so it seems.
KrazyLurt said:
It's the top left button, the G search button, and user icon on the far right.
Click to expand...
The G button is search engine specific, in this case Google. Other search engines will use different icons, some will look out of place with the theme colors.
The user icon, if you are logged in in the browser will be obvious from your profile. The not-signed-in icon seems to be a resource image from the browser, not modifiable through the theme unfortunately .
And the most important, the bottom line separator from the toolbar and the webpage. I want the line removed or the same color as the main toolbar.
Click to expand...
Trial and error:
It might be from your 'theme_toolbar.png' at the lower end, check the image just in case.
That can also be from theme's background to foreground colors combinations but not sure which elements affect this other than toolbar.
Once I got a glitch there and re-installing the theme or updating/restarting the browser fixed it.
 

My Computers

System One System Two

  • OS
    Windows 11 Pro
    Computer type
    PC/Desktop
    Manufacturer/Model
    Intel NUC
    CPU
    i3 8109U
    Motherboard
    Intel
    Memory
    16GB DDR4 @2400
    Graphics Card(s)
    Intel Iris Plus Graphics 655
    Sound Card
    Intel / Realtek HD Audio
    Monitor(s) Displays
    LG-32ML600M
    Screen Resolution
    1920x1080
    Hard Drives
    Intel SSD 250GB + Samsung QVO SSD 1TB
    PSU
    Adapter
    Cooling
    The usual NUC airflow
    Keyboard
    Logitech Orion G610
    Mouse
    SteelSeries Rival 100 Red
    Internet Speed
    Good enough
    Browser
    Chromium, Edge, Firefox
    Antivirus
    Windows Defender
  • Operating System
    CentOS 9 Stream / Alma / Rocky / Fedora
    Computer type
    Laptop
    Manufacturer/Model
    TOSHIBA
    CPU
    Intel i7 4800MQ
    Motherboard
    TOSHIBA
    Memory
    32GB DDR3 @1600
    Graphics card(s)
    NVIDIA Quadro K2100M
    Sound Card
    Realtek HD Audio
    Monitor(s) Displays
    Built-in
    Screen Resolution
    1920x1080
Hopachi said:
Trial and error:
It might be from your 'theme_toolbar.png' at the lower end, check the image just in case.
That can also be from theme's background to foreground colors combinations but not sure which elements affect this other than toolbar.
Once I got a glitch there and re-installing the theme or updating/restarting the browser fixed it.
Click to expand...
Thanks for the reply!
I checked if "theme_toolbar" color had any impact to that line, sadly it didn't. Neither did "theme_frame.png".
 

My Computer

System One

  • OS
    windows 11
I see.
Now I begin to ask myself if it is like this by design?
For instance like a safe guard if the toolbar and page background use the same color, a 'divider' added explicitly to split the two.
Your theme is a good example.

I didn't pay much attention to it lately but I do seem to see a faint line separator there in most themes I used.
And in my main theme I use, the toolbar has a different color than the page background so it passed unnoticed. But there is a faint line between.

From my own experience on the used theme, there is no line added by me anywhere.
Then it might just be like this by design, as other aspects we cannot change in the manifest.

And there were some slight theme modifications along the years as Chrome advanced in version numbers.
If a line was added there at some point, I honestly don't know, but it does look like it.
 

My Computers

System One System Two

  • OS
    Windows 11 Pro
    Computer type
    PC/Desktop
    Manufacturer/Model
    Intel NUC
    CPU
    i3 8109U
    Motherboard
    Intel
    Memory
    16GB DDR4 @2400
    Graphics Card(s)
    Intel Iris Plus Graphics 655
    Sound Card
    Intel / Realtek HD Audio
    Monitor(s) Displays
    LG-32ML600M
    Screen Resolution
    1920x1080
    Hard Drives
    Intel SSD 250GB + Samsung QVO SSD 1TB
    PSU
    Adapter
    Cooling
    The usual NUC airflow
    Keyboard
    Logitech Orion G610
    Mouse
    SteelSeries Rival 100 Red
    Internet Speed
    Good enough
    Browser
    Chromium, Edge, Firefox
    Antivirus
    Windows Defender
  • Operating System
    CentOS 9 Stream / Alma / Rocky / Fedora
    Computer type
    Laptop
    Manufacturer/Model
    TOSHIBA
    CPU
    Intel i7 4800MQ
    Motherboard
    TOSHIBA
    Memory
    32GB DDR3 @1600
    Graphics card(s)
    NVIDIA Quadro K2100M
    Sound Card
    Realtek HD Audio
    Monitor(s) Displays
    Built-in
    Screen Resolution
    1920x1080
Yeah it's definitely by design, it's all over the place, from iOS to Windows 11 to always have a contrast line between objects. I just hoped that it could be edited because I rarely think this fashion style looks good.
These things ebs and flows, from everything sharp and square, to all rounded corners for example.
 

My Computer

System One

  • OS
    windows 11
In Chrome, it seems the Bookmark Bar and other Toolbars are one dynamic entity...

6369.jpg
 

My Computers

System One System Two

  • OS
    Windows 11
    Computer type
    PC/Desktop
    Manufacturer/Model
    ASUS ROG Strix
  • Operating System
    Windows 11
    Computer type
    Laptop
    Manufacturer/Model
    ASUS VivoBook
You must log in or register to reply here.

Latest Support Threads

Latest Tutorials

Back
Top Bottom