Reading list Switch to dark mode

    VS Code Customize Workbench Colors

    Updated 1 April 2021

    In this block, we will learn how to change the color combination of VS code theme. It’s sometimes we chose a theme but we are not satisfied with the few colors, there you want to customize the color combination.

    Download Theme

    Download any of your favorite theme, or you can use your existing theme. I chose Dracula. Now open your workspace settings. Use the following VS Code menu command:

    • On Windows/Linux – File > Preferences > Settings
    • On macOS – Code > Preferences > Settings

    Edit Setting.json

    Now search settings.json file in Search Bar.

    settings.json_

    Open Settings.json file and add workbench.colorCustomizations to customize colors for example, To change Editor background Color Simply add editor.background”: “#090909“.

    editor-bg

    This will change the editor Background color to #090909 . Similarly you can customize other settings also. These are few customize settings of workbench.

    Start your headless eCommerce
    now.
    Find out More
    linenumbers

    After adding these changes you can view the result on your VS code Workbench. Like we have added Active File background color to #007acc and line numbers to #5aec16.

    sidebar-1

    For more Information you can visit https://code.visualstudio.com/api/references/theme-color

    Support

    Still have any issue feel free to add a ticket and let us know your views to make the code better https://webkul.uvdesk.com/en/customer/create-ticket/

    Thanks for Your Time! Have a Good Day!

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content