Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to color and add styling to my types in VSCode when programming Dart

I want to change the colour of my declared types (and possibly add bold, italics and other styling) in VSCode when programming in Dart. Is this possible? I think it would aid readability.

For example, I would like Widget, BuildContext and Loading Container to be in a different colour (maybe a grey). The keywords are in currently in blue.

  @override
  Widget build(BuildContext context) {
    return new LoadingContainer(

enter image description here

like image 983
atreeon Avatar asked Mar 07 '23 07:03

atreeon


1 Answers

To select a different theme select ctrl + shft + p type 'color theme' then choose one. You can also install new themes from the marketplace by typing 'theme' in the extensions:marketplace search bar

For more finite control...in your user settings file for the selected color theme add the following

"editor.tokenColorCustomizations": {
    "[Visual Studio Light]": {
        "types": "#aaaaaa",
        "comments": "#00dd00",
        "functions": "#f00",

...can also define italics, bold and underlined too

    "variables": "#f00",
    "strings": "#FF5555",
    "textMateRules": [
        {
            "scope": "keyword",
            "settings": {
                "fontStyle": "italic ",
            }
        },
like image 113
atreeon Avatar answered Mar 09 '23 17:03

atreeon