Thay đổi theme Visual Studio Code

Từ 1.15 (tháng 7 năm 2017) bạn có thể thay đổi từ settings.json Ctrl+,

"editor.tokenColorCustomizations": {
    "comments": "#d4922f"
},

Từ 1.20 (tháng 1 năm 2018) bạn cũng có thể làm điều đó cho từng chủ đề riêng biệt:

"editor.tokenColorCustomizations": {
    "[Atom One Dark]": {
        "comments": "#d4922f"
    }
},

Tìm đúng phạm vi:

Nhà phát triển: Kiểm tra phạm vi TM editor.action.inspectTMScopes

Ưu tiên chọn:

https://code.visualstudio.com/bloss/2017/02/08/syntax-highlighting-optimizes# lòngmate-theme

Ok, nhiều ví dụ khác (cho js):

"editor.tokenColorCustomizations": {
    "textMateRules": [{
        "scope": "INSERT_SCOPE_HERE",
        "settings": {
            "foreground": "#ff0000"
        }
    }]
}

commentpunctuation.definition.commentcomment.block.documentationstorage.type.class.jsdocentity.name.type.instance.jsdocvariable.other.jsdoc

The most convenient and reliable file storage service

Receive your personal cloud storage with 2Gb of space for free

Để mở rộng câu trả lời và bình luận của @Johnny Derp. Bạn có thể thay đổi màu sắc và kiểu phông chữ bằng cách sử dụng:

"editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": "comment",
        "settings": {
          "fontStyle": "italic",
          "foreground": "#C69650",
        }
      }
    ]
  },

background không thể thay đổi theo cách này, chỉ có màu sắc và kiểu dáng. Kể từ tháng 6 năm 2018.

Chuyển đến cài đặt của bạn.

Sau đó tìm kiếm settings.json mở tệp và sau đó thêm dòng mã này:

"editor.tokenColorCustomizations": {

        "comments": "#229977"
    },

thay đổi màu của các bình luận, dựa trên ý thích của bạn bằng cách di chuột qua màu sắc và chọn màu bạn muốn. Sau đó lưu các thay đổi. (Ctrl + S) Thoát khỏi chương trình. mở nó một lần nữa, bạn sẽ thấy những thay đổi

Có vẻ như màu sắc mã thông báo không thể được tùy chỉnh trong cài đặt tại thời điểm này:

Màu sắc biên tập nổi bật nhất là màu mã thông báo dựa trên ngữ pháp ngôn ngữ được cài đặt. Những màu này được xác định bởi Chủ đề màu và có thể (hiện tại) không thể được tùy chỉnh trong cài đặt.

Nguồn: https://code.visualstudio.com/docs/getstarted/theme-color-reference

Tôi đã nhận thấy rằng nếu bạn đi vào các thư mục chủ đề, ví dụ: C:\Program Files (x86)\Microsoft VS Code\resource\app\extend\theme-monokai và chỉnh sửa tệp monokai-color-theme.json, hãy nhìn đối với dòng có "name": "Comment" và thay đổi màu "foreground", nó sẽ hoạt động. Chỉ cần đảm bảo khởi động lại chương trình.

Giống như Mark đã nói, nhưng thêm vào "scope": sau "comment"

"chấm câu.def định.com"

để tô màu cũng là dấu câu,

ví dụ. (// trong javescript | /* */ trong css | trong html).

"scope": ["comment", "punctuation.definition.comment"]

Flexible, reliable and affordable cloud hosting

Sign up and get $50 bonus within 30-day!

Để thay đổi màu nhận xét Mã VS

Tệp -> Tùy chọn -> Cài đặt

Chọn tab "Cài đặt không gian làm việc" để chỉ thay đổi nó cho dự án này
[.__.] Chọn tab "Cài đặt người dùng" để thay đổi nó cho tất cả các dự án

Thực hiện tìm kiếm "settings.json" và tìm kiếm một tùy chọn để "Chỉnh sửa trong settings.json"

Chèn cài đặt màu này cho các nhận xét ở đâu đó bên trong dấu ngoặc nhọn:

"Editor.tokenColorCustomifying": {
[.__.] "Bình luận": "# ff4"
[.__.]}

Nó có thể phàn nàn rằng bạn đang ghi đè chủ đề màu hiện tại của bạn, chỉ cần bỏ qua điều đó.

Nếu đã có một phần cho "Editor.tokenColorCustomifying" thì chỉ cần thêm dòng để chỉ định màu nhận xét.

Posted by on November 25, 2010

Một ngày làm việc với Visual Studio rất nhiều tiếng, nhiều hồi mình thấy chán với màu sắc mặc định trong giao diện code (Text Editor) của Visual Studio. Mình muốn nó khác đi chút, màu nền ko phải là trắng cho bớt chói,… Với lại mình cũng còn muốn cái Visual Studio của mình trông phải lạ hơn người khác mới thích! Nếu bạn cũng làm việc với Visual Studio nhiều, hẳn bạn cũng sẽ có nhu cầu giống mình. Bài viết này giúp bạn làm điều đó.

Chỉnh màu giao diện từ Options

Để tuỳ chọn thay đổi các chi tiết trong giao diện code, bạn vào menu Tools –> Options. Sau đó chọn mục Environment –> Fonts and Colors. Tại đây bạn có thể chỉnh font, cỡ chữ, màu chữ, và màu tô phía sau của từng chi tiết code.

Cách làm này bạn sẽ chỉnh được tất cả theo ý mình, nhưng bây giờ để chỉnh hết số lượng item khổng lồ trong đó chắc bạn cũng nản chí mà bỏ dở.

Chỉnh màu giao diện dùng Color Scheme

Các setting về Fonts và Colors của Text Editor có thể xuất (export) ra thành file setting riêng. Và người ta gọi file xuất ra giữ thông tin về font và color là Color Scheme để dễ hiểu.

Trên mạng có nhiều nguồn tài nguyên cung cấp các file color scheme được tạo sẵn để bạn import vào setting của mình. Bạn chỉ cần phải biết cách export và import setting mà thôi.

Export Setting hiện tại để dự phòng

Nếu như bạn chưa chỉnh gì trong Fonts and Colors thì setting vẫn ở mặc định và bạn vẫn dễ dàng thiết lập trở lại bằng nút Use Defaults có ở hình trên. Nhưng bạn cũng nên sao lưu dự phòng các setting này ra file riêng. Thực hiện theo hình:

Chọn Export selected environment settings, rồi nhấn Next.

Tại cửa sổ tiếp theo bỏ chọn tất cả các mục, chỉ chọn ở mục Fonts and Colors. Khi đó chỉ có các setting của mục Fonts and Colors được xuất ra file. Sau đó nhấn Next.

Bạn chọn tên file và nơi lưu trữ rồi nhấn Finish để hoàn tất việc xuất file setting.

Nguồn Color Scheme đẹp

Có thể tìm kiếm color scheme cho Visual Studio dễ dàng. Xin giới thiệu với bạn một trang rất thuận tiện để download hoặc chia sẻ color scheme: http://studiostyl.es/ (Studio Styles).

Khi chọn một color scheme bạn chọn phiên bản Visual Studio của mình và nhấn nút download để tải file setting về.

Thậm chí bạn còn có thể chỉnh sửa để tạo color scheme mới trực tiếp trên trang web này. Sau đó chia sẻ hoặc download file setting về qua menu bên dưới.

Trang web này được xây dựng sử dụng: ASP.NET MVC 2, ASP.NET 4, Visual Studio 2010.

Import Settings

Mình tải scheme Zenburn 2010 về được file zenburn-2010.vssettings . Bây giờ ta thực hiện import file setting này vào VS2010.

Vào menu Tools –> Import and Export Settings.

Khác với việc export setting, ở cửa sổ hiện ra ta chọn Import selected environment settings, và nhấn Next.

Tại cửa sổ hiện ra ta có thể chọn Yes, save my current settings để sao lưu setting hiện tại trước khi import. Vì ở bước trên mình đã export setting rồi nên mình chọn No,… Sau đó nhấn Next.

Nhấn Browse để chọn file setting đã tải về, rồi chọn file đó trong list và nhấn Next.

Cuối cùng nhấn Finish, VS thực hiện import setting từ file.

Đây là giao diện của VS2010 máy mình khi apply scheme Zenburn 2010

Mình cảm thấy rất hài lòng với scheme này. Code bây giờ dễ chịu với mắt hơn.

Mong bạn cũng tìm được scheme ưng ý!

Viet TP