Anpassen Ihres VS-Codes

Visual Studio Code
Anpassung
Code-Editor-Themen
Anpassen Ihres VS-Codes cover image

Einführung

Visual Studio Code (VS Code) ist einer der beliebtesten Code-Editoren in der Tech-Branche, da er robuste Funktionen und ein schlankes Design bietet, die ihn zum Code-Editor der Wahl für Entwickler weltweit gemacht haben. Seine Beliebtheit lässt sich zum Teil auf sein anpassbares Erscheinungsbild zurückführen, das es uns ermöglicht, ausgefallene und auffällige Codierbereiche zu erstellen. In diesem Artikel erfahren Sie, wie Sie das Erscheinungsbild von vs code an Ihre Vorlieben anpassen können, einschließlich Code-Editor-Themen, Symbol-Themen und Farbänderungen der Symbolleiste.

Icon-Themen

Auch wenn die Standardsymbole von Visual Studio Code in Ordnung sind, warum sollten Sie sich auf sie beschränken, wenn Sie ein visuelles Fest erleben können? Sie können das Erscheinungsbild Ihres Dateiexplorers mit Symbolthemen ändern, die sowohl seine visuelle Attraktivität als auch seine Benutzerfreundlichkeit verbessern.

Eine der beliebtesten Optionen unter Entwicklern ist die Erweiterung Material Icon Theme. Mit dieser Erweiterung erhält Ihr Datei-Explorer eine farbenfrohe und gut organisierte Sammlung von Symbolen, die dem Material Design von Google nachempfunden ist. Jede Art von Datei hat ihr eigenes, unverwechselbares und sofort erkennbares Symbol, das Ihren Arbeitsbereich insgesamt besser aussehen lässt.

Gehen Sie folgendermaßen vor, um die Erweiterung Material Icon Theme zu installieren:

  1. Öffnen Sie Visual Studio Code.

  2. Wechseln Sie zur Ansicht Erweiterungen, indem Sie auf das Symbol Erweiterungen in der Symbolleiste auf der linken Seite des Fensters klicken.

  3. Suchen Sie nach "Material Icon Theme" und klicken Sie auf "Installieren".

Klicken Sie nach der Installation auf das Zahnradsymbol in der unteren linken Ecke und wählen Sie "File Icon Theme", um das Material Icon Theme auszuwählen.

Code-Editor-Themen

Nachdem Ihr Datei-Explorer nun gut aussieht, wollen wir uns nun dem Code-Editor selbst widmen. Obwohl die Standardthemen von VS Code (hell und dunkel) großartig sind, gibt es Gelegenheiten, bei denen Sie etwas Persönlicheres und Stilvolleres wünschen.

Eine gute Option für ein Thema, insbesondere für diejenigen, die lieber im Dunkeln programmieren, ist die Themenerweiterung Night Owl. Night Owl wurde mit Blick auf Kontrast und Lesbarkeit entwickelt und verfügt über ein beruhigendes Farbschema, das die Augen bei längeren Codesitzungen entlastet.

So installieren Sie die Themenerweiterung Nachteule:

Navigieren Sie zur Ansicht "Erweiterungen".

Suchen Sie nach "Night Owl" und klicken Sie auf "Installieren".

Wählen Sie nach der Installation Night Owl als Thema aus, indem Sie die Befehlspalette öffnen (Strg Umschalt P unter Windows/Linux, Cmd Umschalt P unter macOS), "Farbthema" auswählen und Night Owl aus der Liste der installierten Themen in Ihrem Code-Editor auswählen.

Farbe der Symbolleiste

Nun, da das Aussehen und die Bedienung Ihres Code-Editors perfekt sind, können wir die Farbe der Symbolleiste anpassen, um das i-Tüpfelchen zu setzen. Hier kommt die Peacock-Erweiterung ins Spiel.

Dank der Peacock-Erweiterung können Sie Ihren Arbeitsbereich anpassen, indem Sie die Farbe der Symbolleiste an der Seite Ihres Code-Editors ändern. Das ist nicht nur ästhetisch ansprechend, sondern hilft Ihnen auch, wenn Sie mehrere Instanzen von VS Code geöffnet haben, zwischen ihnen zu unterscheiden.

So installieren Sie die Peacock-Erweiterung:

  1. Rufen Sie die Ansicht Erweiterungen auf.

  2. Suchen Sie nach "Peacock" und klicken Sie auf "Installieren".

Nach der Installation können Sie die Farbe der Symbolleiste anpassen, indem Sie die Befehlspalette öffnen und nach "Peacock" suchen: Geben Sie eine Farbe ein" und geben Sie dann den Hexadezimalwert der Farbe ein, die Sie für Ihre vs code Symbolleiste festlegen möchten.

Schlussfolgerung

Bei der Anpassung von Visual Studio-Code geht es nicht nur darum, die Farben zu ändern. Sie müssen auch eine Programmierumgebung schaffen, die Ihrem Stil entspricht und die Produktivität erhöht. Spielen Sie also ruhig ein wenig herum und schaffen Sie einen Programmierbereich, der Ihre Fantasie in Bezug auf das Aussehen anregt, und erkunden Sie auch andere ausgefallene Funktionen des erstaunlichen VS Code. Viel Spaß beim Programmieren!


Career Services background pattern

Karrieredienste

Contact Section background image

Lass uns in Kontakt bleiben

Code Labs Academy © 2024 Alle Rechte vorbehalten.