Anpassen Ihres VS-Codes

Aktualisiert auf September 02, 2024 3 Minuten gelesen

Anpassen Ihres VS-Codes cover image

Einführung

Visual Studio Code (VS Code) ist einer der beliebtesten Code-Editoren in der Technologiebranche, da er robuste Funktionen und ein leichtes Design bietet, die ihn zum bevorzugten Code-Editor für Entwickler weltweit gemacht haben. Seine Beliebtheit ist zum Teil auf sein anpassbares Erscheinungsbild zurückzuführen, das es uns ermöglicht, ausgefallene und auffällige Codierungsräume zu schaffen. In diesem Artikel erfahren Sie, wie Sie das Erscheinungsbild Ihres vs-Codes an Ihre Vorlieben anpassen können, einschließlich Code-Editor-Themen, Symbolthemen und Farbänderungen der Symbolleiste.

Symbolthemen

Auch wenn die Standardsymbole von Visual Studio Code in Ordnung sind, warum sollten Sie sich auf sie beschränken, wenn Sie ein visuelles Fest haben können? Sie können das Erscheinungsbild Ihres Datei-Explorers mit Symbolthemen ändern, was sowohl seine optische Attraktivität als auch die Benutzerfreundlichkeit verbessert.

Eine der beliebtesten Optionen unter Entwicklern ist die Erweiterung „Material Icon Theme“. Mit dieser Erweiterung verfügt Ihr Datei-Explorer über eine farbenfrohe und gut organisierte Sammlung von Symbolen, die dem Material Design von Google nachempfunden sind. Jede Art von Datei verfügt über ein eigenes, unverwechselbares und sofort erkennbares Symbol, wodurch Ihr Arbeitsbereich insgesamt besser aussieht.

Um die Material Icon Theme-Erweiterung zu installieren, gehen Sie folgendermaßen vor:

  1. Öffnen Sie Visual Studio Code.

  2. Gehen Sie zur Ansicht „Erweiterungen“, indem Sie in der Symbolleiste auf der linken Seite des Fensters auf das Symbol „Erweiterungen“ 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 „Dateisymbol-Design“, um das Material-Symbol-Design auszuwählen.

Code-Editor-Themen

Nachdem Ihr Datei-Explorer nun gut aussieht, konzentrieren wir uns auf den Code-Editor selbst. Obwohl die hellen und dunklen Standardthemen von VS Code großartig sind, gibt es Gelegenheiten, in denen Sie etwas Persönlicheres und Stilvolleres wünschen.

Eine gute Option als Theme, insbesondere für diejenigen, die lieber im Dunkeln programmieren möchten, ist die Theme-Erweiterung „Night Owl“. Night Owl wurde mit Blick auf Kontrast und Lesbarkeit entwickelt und verfügt über ein beruhigendes Farbschema, das dazu beiträgt, die Belastung der Augen bei längeren Codierungssitzungen zu verringern.

So installieren Sie die Night Owl-Themenerweiterung:

Navigieren Sie zur Ansicht „Erweiterungen“.

Suchen Sie nach „Night Owl“ und klicken Sie auf „Installieren“.

Wählen Sie nach der Installation „Night Owl“ als Design aus, indem Sie die Befehlspalette öffnen (Strg+Umschalt+P unter Windows/Linux, Befehl+Umschalt+P unter macOS), „Farbdesign“ auswählen und „Night Owl“ aus der Liste der installierten Designs auswählen in Ihrem Code-Editor.

Symbolleistenfarbe

Nachdem nun das Erscheinungsbild und die Bedienung Ihres Code-Editors perfekt sind, passen wir die Farbe der Symbolleiste an, um das i-Tüpfelchen darauf 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. Dies ist nicht nur ästhetisch ansprechend, sondern kann Ihnen auch bei der Unterscheidung zwischen mehreren Instanzen von VS Code helfen, wenn Sie mehrere Instanzen von VS Code geöffnet haben.

So installieren Sie die Peacock-Erweiterung:

  1. Gehen Sie zur Ansicht „Erweiterungen“.

  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, nach „Pfau: Geben Sie eine Farbe ein“ suchen und dann den Hexadezimalwert der Farbe eingeben, die Sie für Ihre vs-Code-Symbolleiste festlegen möchten.

Abschluss

Beim Anpassen von Visual Studio-Code geht es um mehr als nur das Ändern von Farben. Sie müssen außerdem eine Codierungsumgebung erstellen, die Ihrem Stil entspricht und die Produktivität steigert. Fühlen Sie sich also frei, herumzuspielen und einen Codierungsbereich zu erstellen, der Ihre Fantasie in Bezug auf das Erscheinungsbild anregt und auch andere ausgefallene Funktionen des erstaunlichen VS-Codes erkundet. Viel Spaß beim Codieren!