CentBrowser Forum
Themes - How to change color of the buttons? - Printable Version

+- CentBrowser Forum (https://www.centbrowser.net/en)
+-- Forum: Members Area (https://www.centbrowser.net/en/forumdisplay.php?fid=3)
+--- Forum: General Discuss (https://www.centbrowser.net/en/forumdisplay.php?fid=5)
+--- Thread: Themes - How to change color of the buttons? (/showthread.php?tid=4020)



Themes - How to change color of the buttons? - MariaArk - 05-08-2021

I address this question to those who know how to create themes. I don’t know what property can be used to adjust the color of some buttons (tab control button, close, maximize, etc.) and recolor the borders around the active tab and on the borders around the toolbar. I have looked at several manuals, but nowhere is there an answer to my question. Is this possible or are these items not configurable?

[Image: T8ec0zN.png]


Manifest code:
Code:
{
  "manifest_version": 2,
  "version": "1.27",
  "name": "Blue Theme",
  "theme": {
    "images" : { //чтобы добавить картинки
        "theme_frame": "images/frame.png", //фон окна
        "theme_frame_inactive": "images/frame.png", //inactive это для элементов когда окно неактивно
        "theme_frame_incognito": "images/frame.png", //incognito это для инкогнито
        "theme_frame_incognito_inactive": "images/frame.png", // тут понятно..
        "theme_toolbar": "images/toolbar.png",  //фон текущей вкладки и панели инструментов
        "theme_tab_background_incognito": "images/tab_incog.png",
        "theme_tab_background": "images/tab.png", //фон остальных вкладок
        "theme_ntp_background": "images/bg.png", //фон new tab page для хрома и подобных ему
        "theme_button_background": "images/button.png" //фон кнопок
    },
    "colors" : { //чтобы поменять цвета
        "frame": [ 143, 160, 185 ], //фон окна
        "frame_inactive": [ 164, 174, 190 ],
        "frame_incognito": [ 143, 160, 185 ],
        "frame_incognito_inactive": [ 164, 174, 190 ],
        "toolbar": [ 143, 160, 185 ], //фон панели
        "tab_text": [ 255, 255, 255 ], //цвет текста текущей вкладки
        "tab_text_inactive": [ 255, 255, 255 ],
        "tab_background_text": [ 203, 213, 227 ], //цвет текста остальных вкладок
        "tab_background_text_inactive": [ 203, 213, 227 ],
        "bookmark_text": [ 255, 255, 255 ], //цвет текста закладки
        "ntp_background": [  143, 160, 185 ] //фон new tab page
       
    },
    "tints" : { //специальная настройка чтобы поменять оттенки в формате hls, значение -1.0 ничего не меняет
        "buttons": [ 0, 0, 1 ], //оттенки кнопок
        "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 ],
        "background_tab": [ -1.0, -1.0, -1.0 ] // оттенки неактивной вкладки инкогнито
    },
    "properties" : { // другие настройки параметров темы
        "ntp_background_alignment": "left bottom",
        "ntp_background_repeat": "repeat-x",
        "ntp_logo_alternate": 1
    }
  }
}



RE: Themes - How to change color of the buttons? - MariaArk - 05-09-2021

If anyone finds this topic. I haven't solved the problem completely. I finally found an official manual that says some colors are generated automatically. https://source.chromium.org/chromium/chromium/src/+/main:chrome/browser/themes/browser_theme_pack.cc (line 256) If you are making a light frame, the close buttons will be dark and this cannot be fixed (maybe this setting windows10, not chrome). If you make light text in an omnibox, then the omnibox will also turn black when you enter an address. The only thing that I managed to adjust was the borders, again, the color changed automatically only when I changed some properties (by the way, I had to use all possible properties of the color block for more subtle automatic settings of non-customizable properties). This is the best result that I could achieve:

[Image: 3fhe4m1.png]


RE: Themes - How to change color of the buttons? - Admini - 05-09-2021

The color of tab indicator button and system buttons is the contrast of "colors":"frame"
There is a detailed instruction:
https://sites.google.com/site/gsugsa/google-apps/google-chrome/how-to-create-a-theme

You can look into the file "manifest.json" of this theme:
https://chrome.google.com/webstore/detail/slinky-elegant/bmanlajnpdncmhfkiccmbgeocgbncfln