Vscode Theme Color Matching VEX's?

   760   8   2
User Avatar
Member
527 posts
Joined: 7月 2005
Offline
I was wondering if anyone found a way to match Vscode's text color them to match Houdini's vex colors?
soho vfx
User Avatar
Member
6 posts
Joined: 3月 2022
Offline
Add this to your VSCode settings.json, and you'll achieve nearly 1 to 1 similarity. While there are a few instances where VSCode might appear slightly different, about 90% of the time it will look identical.


{
// Visual customizations
"editor.tokenColorCustomizations": {
"textMateRules": [
{

// Following will be in italic
"scope": [
"comment",
"entity.name.type.class", //class names
"keyword", //import, export, return
"constant", //String, Number, Boolean, this, super
"storage.modifier", //static keyword
"storage.type.class.js", //class keyword
],
"settings": {
"fontStyle": "italic"
}
},
{

// Following will be excluded from italics (VSCode has some defaults for italics)
"scope": [
"invalid",
"keyword.operator",
"constant.numeric.css",
"keyword.other.unit.px.css",
"constant.numeric.decimal.js",
"constant.numeric.json"
],
"settings": {
"fontStyle": ""
}
},
{

// Vex colors like in Houdini
"scope": [
"keyword.operator.vex",
"constant.numeric.vex",
"punctuation.group.vex",
"constant.language",
],
"settings": {
"foreground": "#CCCCCC"
}
},
{
"scope": [
"variable.other.normal.vex",
"entity.name.tag.vex",
"keyword.preprocessor.vex",
"comment.block.preprocessor.vex"
],
"settings": {
"foreground": "#DEAE6F"
}
},
{
"scope": [
"storage.type.builtin.vex",
"keyword.control.vex",
"storage.modifier.vex",
],
"settings": {
"foreground": "#EB76EB"
}
},
{
"scope": [
"entity.name.function.vex",
],
"settings": {
"foreground": "#66CCCC"
}
},
{
"scope": [
"comment.line.double-slash.vex",
],
"settings": {
"foreground": "#EDED77"
}
},
{
"scope": [
"string.quoted.double.vex",
"string.quoted.single.vex",
],
"settings": {
"foreground": "#66CC66"
}
},
]
}
}
Edited by timurproko - 2024年4月21日 13:18:39

Attachments:
Snag_14864041.png (820.6 KB)

User Avatar
Member
146 posts
Joined: 1月 2016
Offline
@timurproko would you be so kind and send your whole settings.json file please?
User Avatar
Member
6 posts
Joined: 3月 2022
Offline
@ikoon, thank you for your input. However, sharing the other settings may not directly relate to this topic. Could you please clarify the issue you're facing based on the information I provided earlier?
User Avatar
Member
146 posts
Joined: 1月 2016
Offline
Thanks a lot! I just wasn't able to merge your settings with my settings (I always made my file corrupted). I understand that whole file is maybe too much. Would you please paste a bit more, maybe also keep the header and footer, so that I could orient myself better?
User Avatar
Member
55 posts
Joined: 1月 2018
Offline
+1 for sharing other settings. I dont know wich ones but your UI looks much better and modern. I preffer flat design without unnecessery decorative elements like shadows and boxes that looks like old Winamp

So if you could share that i would be greatfull
User Avatar
Member
6 posts
Joined: 3月 2022
Offline
Hey everyone, I've made some updates to the code above. If you use it on its own, it should work. Since everyone's VSCode settings can be different, you'll need to decide how to integrate it into your specific configuration.
You could start by clearing all your configurations and testing my code first.
User Avatar
Member
146 posts
Joined: 1月 2016
Offline
Hi @timurproko, thank you very much! I managed to merge it and it works perfectly now.

(edit: I attach my settings.json for anyone who is lost in brackets, as I was )
Edited by ikoon - 2024年4月22日 02:46:54

Attachments:
settings.json (4.2 KB)

User Avatar
Member
6 posts
Joined: 3月 2022
Offline
@ikoon, I'm glad it all came together. Thanks for providing the JSON file!
Edited by timurproko - 2024年4月22日 11:07:03
  • Quick Links