Core-Stile, Farben, Varianten und alternative Farbpaletten

  • Freigeben Version: Yokohama
  • Aktualisiert 30. Januar 2025
  • 2 Minuten Lesedauer
  • Sie können das Erscheinungsbild der UI Next Experience für verschiedene Benutzer anpassen, indem Sie die Kernstile, Varianten und alternative Farbpaletten konfigurieren.

    Core-Stile in Themengenerator

    Ein Kernstil ist die Basisversion eines Stils. Zu den Kernstilen gehören Farbe, Form und Formular, Typografie und Bilder.

    Farben in Themengenerator

    Verwenden Sie beim Bearbeiten von Komponenten die Farbauswahl, um die Hintergrundfarbe der Canvas zu ändern und anzuzeigen, wie die Komponentenfarben auf verschiedenen Hintergründen gerendert werden.
    Hinweis:
    Das Aktualisieren der Canvas-Farbe gilt nicht für die Instanz. Nur komponentenspezifische Hooks werden auf die Instanz angewendet, wenn Sie ein bearbeitetes Design in der Instanz veröffentlichen.
    Wenn Sie Designfarben bearbeiten, können Sie das Kontrastverhältnis in der Farbauswahl anzeigen. Der Wert wird aktualisiert, wenn Sie die Farbe in der Palette oder in der Ansicht „Meine Farben“ ändern.

    Varianten/alternative Farbpaletten in Themengenerator

    Sowohl Varianten als auch alternative Farbpaletten sind Arten von UX-Stildatensätzen, die als Variante kategorisiert sind.

    Eine Variante ist eine alternative Version eines vorhandenen Designs, das normalerweise für Barrierefreiheit entwickelt wurde und das Ihre Anwender in den Einstellungen auswählen können. Ein Beispiel für eine Variante ist die dunkle Version des Standarddesigns Polaris, das im Lieferumfang von Next Experienceenthalten ist. Die Variante „Dunkel“ kann verwendet werden, um die Barrierefreiheit für sehbehinderte Benutzer zu verbessern, indem helle Hintergründe durch dunklere ersetzt und die Textfarben entsprechend kontrastiert werden.

    Eine alternative Farbpalette ist eine Änderung, die Sie an den Farben eines Designs vornehmen können, und dient zu visuellen Zwecken. Sie können diese Palette auf der Seite Themengenerator „Manager“ für jedes Design mit Ausnahme des Standarddesigns Polaris definieren. Wenn Sie ein vorhandenes Design verwenden, um eine alternative Farbpalette zu erstellen, wird die alternative Farbpalette mit diesem primären Design gruppiert und hat zunächst dessen Logo, Farbe, Typografie und Formstile gemeinsam. Der einzige Unterschied zum primären Design besteht zunächst darin, dass Sie ihm einen eindeutigen Namen zuweisen.

    Als Nächstes definieren Sie die Primärfarbe für die alternative Farbpalette. Diese Farbe wird verwendet, um die Navigationsleiste, Menüs und andere allgemeine Komponenten zu identifizieren. Definieren Sie auf ähnliche Weise eine Sekundärfarbe,, falls erforderlich. Wenn für Ihre Anwenderoberfläche keine Sekundärfarbe erforderlich ist, wird die Primärfarbe verwendet. Zuletzt definieren Sie eine neutrale Farbe, um Trennlinien und Container definieren zu können. Es sind zwei Basispaletten verfügbar: hell und dunkel.
    Hinweis:
    Sekundäre und neutrale Farben können in der dunklen alternativen Farbpalette nicht bearbeitet werden.

    Wenn die Palette mit den von Ihnen ausgewählten Farben erstellt wurde, können Sie sie umbenennen. Sie können auch Zeigen Sie eine Vorschau aller im verfügbaren UI-Assets an Now Platform um zu visualisieren, wie sie gerendert werden, wenn Sie sie auf Ihre Instanz anwenden.

    Hinweis:
    Die dunklen Varianten gelten nicht für für Core-UI, zuvor als UI16 bezeichnet. Core-UI ist die Schnittstelle, die Sie verwenden, wenn Next Experience ist inaktiv. Die dunklen Varianten erstrecken sich jedoch auf die meisten Aspekte von Next Experience.