'Is there a way of making the Active Tab Border highlighted on top instead of at the bottom?

With the tab.activeBorder you can highlight the bottom of the active tab, but how do you highlight the top of the tab instead, like in Firefox's current design?

An example of highlighting with tab.activeBorder:

"workbench.colorCustomizations": {    // Can customize each aspect
    "[One Dark Pro]": {               // Optional
        "tab.activeBorder": "#0A84FF" // Active Tab Highlighting
    }
},

visual-studio-code vscode-settings

Solution 1:^[1]

you can add this to .vscode/settings.json

"workbench.colorCustomizations": {
    "tab.activeBorder": "#ff0000",
    "tab.unfocusedActiveBorder": "#000000"
}

Solution 2:^[2]

You can also colorize background of tab:

"workbench.colorCustomizations": {
    "tab.activeBackground": "#0000ff"
}

Solution 3:^[3]

Go to Settings
Type colorCustomizations in the link at the top
Against the option "Workbench: Color Customizations" select "Edit in settings.json" as shown in the image below

Now add JSON values such as

"workbench.colorCustomizations": {
    "tab.activeBorderTop": "#12ff00",
    "tab.activeBackground": "#c41111"
}

Solution 4:^[4]

Just to chime a little. Once you are in the json settings files and you have helper turned on (I forget what that setting is called), you can see a popup of all the options when you type the opening quote: Hovering over the options also shows the description:

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	tbo47
Solution 2	Zvezdochka
Solution 3	Amol
Solution 4

'Is there a way of making the Active Tab Border highlighted on top instead of at the bottom?

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]

Solution 4:^[4]