anon80475429 mentioned a way to fix the top bar of the Studio window looking awful if your Windows 10 personalization settings are still default. The following are their instructions.
For some reason, in Windows 10 they changed the title bar to, by default, not take on the colour assigned from the personalization settings - hence why the personalization settings also changed.
These instructions will only apply to Windows 10!
To get a dark studio title bar, it’s extremely easy
NOTE: Very frustratingly this also has an annoying side effect because Windows 10 will only apply the accent colour to the currently focused Window (e.g. if you clicked on Discord on another screen) it will cause studio title bar to revert back to white.
There is a hackish solution for Windows 10 to force it to stay the accent color, but that’s a long story and requires modifying Windows 10 files (but results in hugely better results if you see mine). Here’s mine with a dark theme applied to everything.
The problem here is that they can’t just scrap a feature because one person asks for it to change. Myself, and clearly others based on responses to you, like the way it is now. I would have hated if it carried my theme over to dark theme, and greatly prefer the way it is now.
If you want to have the ability to make preset script editor colors, then that’s something completely seperate from dark theme and belongs in a #platform-feedback:studio-features thread.
Just to clear up some confusion here: Yes, Studio does save the script color themes per UI Theme.
If you’re on Windows, you can actually see this data stored in the Registry Editor (regedit.exe)
I can understand why some people might have been caught off guard by this. Perhaps the Studio team could make it copy over the LightEditorColors to the DarkEditorColors if the editorBackgroundColor is using a dark color?
I wouldn’t call it bad programming because it’s working as intended.
I think it was more of an oversight that modified scripting themes weren’t considered.
Please, no. I really like the default dark editor theme and would like to use it, while keeping my light theme color scheme the dark one it is now.
It’s not too much work to change the dark theme color scheme, and isn’t worth the work from the studio team to get a feature in that doesn’t even give any new ability. It’s really just a quality of life feature that isn’t even quality of life for everyone, and in turn would just take away the dark theme default editor colors from those of us who like them, but use a dark background in our light theme background.
So happy that studio finally has a dark theme, but the icons look… off… I’d say they look too light. Not too surprising, as they were created with the light theme in mind, would just be a nice bonus to change them based on theme too.
Just noticed the + sign to quickly add items in the Explorer panel does not work with Dark theme when you have a VehicleSeat. It works with other objects.
I have not experienced this issue, even after Roblox Client and Studio updated a few times since switching to dark theme. But I know something like this will get annoying pretty quick so hopefully you get it resolved soon!
It would be amazing to have a diagram that shows an example widget with the enumerators listed on the side, and arrows pointing to the color where it is used in the example. This would make it really easy to produce theme-sensitive widgets without needing to work off of the module that Roblox provides.
Right now there’s only this list as far as I can see, and while the names are somewhat self-descriptive, it’d be nice to have something more than just this list so we’re sure we’re mapping elements to the right enumerator: https://www.robloxdev.com/api-reference/enum/StudioStyleGuideColor
Adding onto this, and I know this thread is pretty old now, I’ve created a pretty useful script for detecting the GuideColor and Modifier Enums between themes.
Basically what the script does is take in Color3 values which correspond to a studio UI element when applied to different themes (I use an eyedropper tool to get these values, preferably RGB)
local Studio = settings().Studio
local ThemeColorData = {}
local savedThemeData = {}
local amountLoadedThemes = 0
local guideColorEnums = Enum.StudioStyleGuideColor:GetEnumItems()
local modifierColorEnums = Enum.StudioStyleGuideModifier:GetEnumItems()
local themeChange
_G.ThemeColorData = ThemeColorData
local DEFAULT_THEME_NAME = "Default"
local AMOUNT_THEMES = 2 --Themes may be added or removed and I was told that 'UI Theme' Enum would be removed
function ThemeColorData:FindMatchingGuideAndModifier()
warn("Please load themes first")
end
function ThemeColorData:FindAndPrintMatchingGuideAndModifier()
warn("Please load themes first")
end
warn("Please load each theme")
warn("Waiting...")
function checkTheme()
warn("Reading data, please wait...")
local theme = Studio.Theme
if theme.Name == DEFAULT_THEME_NAME then return end
if savedThemeData[theme.Name] == nil then
savedThemeData[theme.Name] = {}
local data = savedThemeData[theme.Name]
for _, guide in pairs(guideColorEnums) do
data[guide] = {}
for _, modifier in pairs(modifierColorEnums) do
data[guide][modifier] = Studio.Theme:GetColor(guide,modifier)
end
end
end
amountLoadedThemes = amountLoadedThemes + 1
warn(amountLoadedThemes.." of "..AMOUNT_THEMES.." themes loaded")
if amountLoadedThemes == AMOUNT_THEMES then
themeChange:Disconnect()
end
end
checkTheme()
themeChange = Studio.ThemeChanged:Connect(function()
checkTheme()
end)
repeat wait() until amountLoadedThemes == AMOUNT_THEMES
warn("You may now run the functions")
--Overwrite old functions
function ThemeColorData:FindMatchingGuideAndModifier(...)
local colorParameters = {...}
local matches = {}
for _, guide in pairs(guideColorEnums) do
for _, modifier in pairs(modifierColorEnums) do
local compatableThemes = {}
for themeName, _ in pairs(savedThemeData) do
local pairColor = savedThemeData[themeName][guide][modifier]
for _, savedColor in pairs(colorParameters) do
if savedColor == pairColor then
table.insert(compatableThemes,themeName)
end
end
end
if #colorParameters == #compatableThemes then
table.insert(matches,{Modifier = modifier, Guide = guide, CompatableThemes = compatableThemes})
end
end
end
if #matches > 0 then return matches end
warn("No compatable colours themes found")
end
function ThemeColorData:FindAndPrintMatchingGuideAndModifier(...)
local matches = ThemeColorData:FindMatchingGuideAndModifier(...)
for _, colorData in pairs(matches) do
for i, themeName in pairs(colorData.CompatableThemes) do
if i == 1 then --Idk why but this fixes '\n (x2)' print
print("\nCompatable theme: "..themeName)
else
print("Compatable theme: "..themeName)
end
end
print(" Guide: ".. tostring(colorData.Guide))
print(" Modifier: "..tostring(colorData.Modifier))
end
end
How to use:
Paste above script into command bar
use one of the functions the script provides, I will use ‘FindAndPrintMatchingGuideAndModifier’ in my example below
_G.ThemeColorData:FindAndPrintMatchingGuideAndModifier(
Color3.fromRGB(238,238,238), --Light theme element color
Color3.fromRGB(34,34,34)) --Dark theme element color
Output:
Compatable theme: Light
Compatable theme: Dark
Guide: Enum.StudioStyleGuideColor.Mid
Modifier: Enum.StudioStyleGuideModifier.Default
Compatable theme: Light
Compatable theme: Dark
Guide: Enum.StudioStyleGuideColor.Mid
Modifier: Enum.StudioStyleGuideModifier.Selected
Compatable theme: Light
Compatable theme: Dark
Guide: Enum.StudioStyleGuideColor.Mid
Modifier: Enum.StudioStyleGuideModifier.Pressed
Compatable theme: Light
Compatable theme: Dark
Guide: Enum.StudioStyleGuideColor.Mid
Modifier: Enum.StudioStyleGuideModifier.Disabled
Sorry if the code format is messed up, when I pasted my code it messed up, I’m pretty sure I fixed most of it.
This misses a lot of matches. For example, with your script, the only match for (53, 53, 53) is:
Compatable theme: Dark
Guide: Enum.StudioStyleGuideColor.Titlebar
Modifier: Enum.StudioStyleGuideModifier.Default
But with the script that I use:
local Studio = settings().Studio
local Theme = Studio.Theme
local function areColorsEqual(a, b)
local a_r, a_g, a_b = a.r*255, a.g*255, a.b*255
local b_r, b_g, b_b = b.r*255, b.g*255, b.b*255
return math.abs(a_r - b_r) < 0.5 and math.abs(a_g - b_g) < 0.5 and math.abs(a_b - b_b) < 0.5
end
function getMatchingEnumsForColor(targetColor)
for _, guide in next, Enum.StudioStyleGuideColor:GetEnumItems() do
local modifierMatches = {}
for _, modifier in next, Enum.StudioStyleGuideModifier:GetEnumItems() do
local color = Theme:GetColor(guide, modifier)
if areColorsEqual(targetColor, color) then
table.insert(modifierMatches, modifier)
end
end
if #modifierMatches > 0 then
print(guide.Name)
for _, modifier in next, modifierMatches do
print(" ", modifier.Name)
end
end
end
end
getMatchingEnumsForColor(Color3.fromRGB(53, 53, 53))
Prints the following, provided that the current theme is Dark (all of which are correct matches):
Hey XAXA, the code I provided was an example that I whipped up for myself in a few minutes, you’re absolutely right that the code doesn’t give all the matches, I’ll most likely edit the code later so that this works as expected.
Although your code works great, this only works for one theme, so the corresponding color on another theme may not be the same when attempting to find the correct guide and modifier
