Designs

A theme changes how GDM looks and keeps everything where it was: the same windows, menus and buttons in the same places, drawn in other colours, shapes and icons. Each theme has a light and a dark side.

Auswählen

Öffnen Sie Ansicht → Design und klicken Sie auf ein Design: Das gesamte Fenster ändert sich sofort, ohne Neustart. Ansicht → Dark Mode-Unterstützung und Ansicht → Immer dunkel wählen dann die helle oder dunkle Seite, wie beim klassischen Aussehen (Dark Mode).

The built-in themes are Classic (GDM's own look, the default), Native (your system's accent colour and contrast), High contrast, and the style themes Metro, Adwaita, Breeze, Luna, Aero and Aqua, each with its own control shapes and icons, and on Windows its own title bar. Getting started describes each one; the website's Themes page shows them all, light and dark.

Speicherort der Design-Dateien

Theme files you make or download go in GDM's themes folder. View → Theme → Open themes folder opens it (and makes it the first time). It is in GDM's data folder:

Innerhalb von zwei Sekunden erscheint eine neue Datei unter den integrierten Designs in Ansicht → Design, gekennzeichnet durch das name, das sie sich selbst gibt. Nachdem Sie eine Datei bearbeitet haben, wählen Sie sie erneut in Ansicht → Design aus, um die Änderung zu sehen.

Ein Design kann eine einzelne Datei (harbour.toml) oder ein eigener Ordner (harbour/theme.toml) sein, wenn es Symbole mitbringt.

View → Theme → Add a theme file… does it for you: pick a file anywhere, and GDM copies it into the themes folder and uses it at once. A file that isn't a theme stays out, and GDM says why.

Base16- und pywal-Farbschemata

Farbschemata, die für andere Programme erstellt wurden, sind ebenfalls Designs, ohne dass eine Konvertierung erforderlich ist:

• Ein Base16-Schema, die .yaml-Datei, in der die Base16- und Base24-Schemata vorliegen: sowohl das klassische Layout (scheme: und base00 bis base0F oben) als auch das neuere (name: und ein palette:-Block). Ein Base24-Schema wird als seine ersten 16 Farben gelesen.
• pywals colors.json oder die Datei eines beliebigen Programms im pywal-Format (wallusts pywal-Vorlage).

Fügen Sie es mit Ansicht → Design → Designdatei hinzufügen… hinzu oder legen Sie es selbst in den Designordner. Es wird unter Ansicht → Design unter dem Namen des Schemas angezeigt (name: oder scheme:; pywals ist nach dem Hintergrundbild benannt).

pywal itself: once wal has run, View → Theme lists pywal, read straight from where pywal writes its colours: ~/.cache/wal/colors.json (on Windows %USERPROFILE%\.cache\wal\colors.json, where winwal and pywal write it; $PYWAL_CACHE_DIR or $XDG_CACHE_HOME/wal when you set them). Pick it and GDM follows your wallpaper: each time wal writes new colours, GDM takes them within two seconds. It looks only at the file's date and size, every two seconds, and only while pywal is the theme. A copy added with Add a theme file… keeps the colours it had.

A scheme changes colours only, on the classic look: every window, button and menu stays where it was. A dark scheme makes GDM dark and a light one light, whatever View → Always dark says. The scheme's colours go where they mean the same:

Borders and the hover and pressed shades are mixed from these, as for a theme file's [seeds]. Text stays readable: text and secondary text at 4.5:1 or more against every background they sit on (WCAG AA), the accent at 3:1. A scheme short of that has those colours moved a little darker (lighter on a dark scheme) until they pass; GDM's log says which.

Um mehr als nur Farben zu ändern, erstellen Sie eine Designdatei, die das Schema anhand ihres Dateinamens erbt und das hinzufügt, was Sie möchten:

name = "Gruvbox, my way"
inherits = "gruvbox-dark-medium"   # gruvbox-dark-medium.yaml, beside it
icons = "accent"

[sizes]
radius = 6

inherits = "pywal"funktioniert auf die gleiche Weise und folgt auch wal.

Die Datei

Ein Design ist eine kleine Textdatei in TOML (oder JSON, .json; oder ein Farbschema, .yaml). Es benennt nur das, was es ändert; alles andere stammt von dem Design, das es inherits:

name = "Harbour"
inherits = "classic"
icons = "color"

[seeds.light]
background = "#eef3f6"
surface = "#ffffff"
text = "#11202b"
accent = "#0f6c8c"

[seeds.dark]
background = "#14212a"
surface = "#0e171d"
text = "#e8f0f4"
accent = "#5cc3e6"

[sizes]
radius = 6

[controls]
focus = "ring"

• name – was Ansicht → Design auflistet; der Dateiname, wenn keiner vorhanden ist.
• inherits – das Design, von dem Ihres ausgeht: classic (die Standardeinstellung, wenn weggelassen), die ID eines integrierten Designs (metro, adwaita, breeze, luna, aero, aqua, high-contrast) oder eine andere Design-Datei im selben Ordner, benannt nach ihrem Dateinamen ohne .toml. Eine Datei, die eine andere erbt, kann wiederum geerbt werden; ein Design kann sich nicht selbst erben.
• [seeds] — a handful of colours (background, surface, header, text, accent, selection, error, warning, success) that GDM spreads over every control. [seeds.light] and [seeds.dark] give each side its own.
• [colors] – einzelne Farbrollen (wie window, accent oder "segments.done") auf beiden Seiten; [light] und [dark] nur auf einer Seite. Eine Farbe ist #rrggbb oder #rrggbbaa mit Transparenz. Die von einer Datei festgelegten Rollen setzen sich über ihre Basisfarben hinweg.
• [sizes] – Eckenradien, Rahmenbreiten, Schriftgrößen und Zeilenhöhen, in Pixeln.
• [controls] – die Form von Textfeldern, Kontrollkästchen, Schaltflächen, Fortschrittsbalken, Bildlaufleisten, der Fokusmarkierung und der Titelleiste.
• icons – color, mono (eine Farbe) oder accent.
• contrast = "high" – verstärkt jede Kanten- und Textfarbe zusätzlich zum Rest.

Every colour role, size and control style, with what it sets, is listed on the website's Themes page (read from GDM's own code, so it never drifts). The built-in themes are written the same way: read them on GitHub.

A key GDM doesn't know, or a value it can't read, is skipped and written to GDM's log (the logs folder beside the themes folder), so a file made for a newer GDM still loads. A file that isn't valid TOML or JSON doesn't load, and the log says why. A file named like a built-in theme (metro.toml) is passed over: give yours a name of its own.

Symbole

Ein Design in einem eigenen Ordner (harbour/theme.toml) kann seine Symbole in icons/16 und icons/24 (und, für PNG-Bilder, icons/32 und icons/48, verwendet auf einem Bildschirm mit 150 % Skalierung und mehr) mitbringen, jeweils benannt nach dem, was es zeigt (tb-add-url.svg, cat-music.png…). SVG- und PNG-Dateien behalten ihre Farben; -symbolic.svg und -symbolic.png-Dateien, wie GNOME und KDE sie benennen, übernehmen die Textfarbe des Designs. Ein Symbol, das im Set fehlt, wird so gezeichnet, wie es das klassische Aussehen zeichnet. Die vollständige Liste der Namen finden Sie in themeicons.rs (NEEDS).

Erstellen

1. Ansicht → Design → Themenordner öffnen und dort eine neue .toml-Datei erstellen (beliebiger Texteditor).
2. Beginnen Sie mit dem obigen Beispiel: Ändern Sie die Farben der Basisfarben und fügen Sie dann nach und nach Rollen und Größen hinzu.
3. Wählen Sie es in Ansicht → Design aus und betrachten Sie beide Seiten: Ansicht → Immer dunkel ein- und ausgeschaltet. Überprüfen Sie, ob der Text lesbar und die Fokusmarkierung auf beiden Seiten sichtbar ist.

Die Design-Seite der Website enthält eine Eingabeaufforderung, die Sie einem KI-Assistenten geben können, mit dem Format, jedem Schlüssel und den Regeln, um ein Design aus einer Beschreibung für Sie zu erstellen.

Teilen

Haben Sie etwas erstellt, das anderen gefallen könnte? Eröffnen Sie einen Pull Request, der es zu crates/app/assets/themes hinzufügt, mit:

• der .toml-Datei und dem zugehörigen Icon-Ordner, falls vorhanden;
• Screenshots des Hauptfensters in seiner hellen und dunklen Ansicht;
• a SOURCES.txt beside any icons, saying who drew them and under which licence. Icons must be your own or under a licence that lets GDM share them (GPL-3.0), never copied from another program.

Noch unsicher? Zeigen Sie es zuerst in den Diskussionen. CONTRIBUTING.md erklärt, wie Pull Requests hier funktionieren.

Nächste Schritte

• Erste Schritte →
• Optionen →