Principes Bases Accessibilité Système de design Guidelines Deutsch Français Italiano English Nos principes de design Centré sur l’utilisateur Reconnaissable Inclusif Minimaliste Holistique Auto-explicatif Axé sur les tâches Approprié Portail de la marque CFF Logo Horloge numérique Droits d’utilisation Couleurs de base Couleurs supplémentaires Couleurs off-brand Icônes Icônes de l’horaire Pictogrammes À propos de l’accessibilité À propos de ce guide Contact Informations complémentaires Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Conception Développer FAQ Aide Procès Contribution Contact Aperçu Base Composants Aperçu Releases Design Tokens Composants Aperçu Base Informations Aperçu Base Composants Aperçu Power-Apps Bandeaux publicitaires numériques SAP IA Design : Bases Icônes d’applications Cette page n'est pas disponible dans la langue souhaitée. Langues disponibles: Deutsch English Clock Info

Die digitale SBB Uhr wird in Webanwendungen oder auf dynamischen Kundeninformationskanälen im Zug oder am Bahnhof eingesetzt. Sie imitiert die Bewegungen und adaptiert das Design der physischen SBB Uhr. Die SBB Bahnhofsuhr ist marken- und urheberrechtlich geschützt.

Verwendung

Sie darf ausschliesslich von allen Schweizer Infrastrukturbetreibern (ISB) und konzessionierten Transportunternehmen (KTU) genutzt werden. Sie muss genauso verwendet werden, wie sie spezifiziert ist.
Die Uhr soll auf einem einfarbigen Hintergrund platziert werden, Platzierungen auf Bilder oder Grafiken sind zu unterlassen. Auf hellen Hintergründen wird das Zifferblatt mit einem grauen Rahmen visuell vom Hintergrund getrennt, auf dunklen Hintergründen ist die Version ohne Rahmen zu verwenden.

Was macht die Komponente?

Die SBB Uhr gibt die Systemzeit des Ausgabegerätes in analoger Form aus. Es ist darauf zu achten, dass die Systemzeit von einem verlässlichen Zeitserver bezogen wird, sofern darauf Einfluss genommen werden kann.

Wann soll die Komponente eingesetzt werden?

  • Die Komponente kommt überall dort zum Einsatz, wo die genaue Zeit kommuniziert werden soll. In den meisten Fällen sind dies Ausgabegeräte mit Echtzeitinformationen zum öffentlichen Verkehr.
  • Die Uhr kann auch als Stilelement verwendet werden, der Kundennutzen muss jedoch in allen Fällen gewährleistet sein.

Regeln

  • Die Mindestgrösse der Uhr darf 75px x 75px nicht unterschreiten.
  • Je nach Einsatzort ist die Mindestgrösse der Betrachtungsdistanz anzupassen. Als Faustregel gilt, Betrachtungsdistanz / 60 = Uhrgrösse (z.B. 3000mm / 60 = 50mm Uhrgrösse).
  • Pro Seite / Ansicht soll nur eine Uhr eingesetzt werden.
  • Der Abstand der Uhr zu den nächstgelegenen Elementen (Margin) muss mindestens je Seite 20% des Uhrdurchmessers betragen.
Footer
Anatomie

Anatomie der Komponente


Demo

Spielwiese

Mode (System-Einstellung) Light Dark Hintergrund White Midnight Milk Charcoal Cloud Iron Midnight White Charcoal Milk Iron Cloud
Default
Paused
HTML in Zwischenablage kopiert.
Implementation

The sbb-clock component displays an analog clock face in the style of the classic SBB station clock.

It mimics its behavior too, completing a rotation in approximately 58.5 seconds,
then it briefly pauses at the clock top before starting a new rotation.

<sbb-clock></sbb-clock>

To simulate the current time, you can use the now property
which accepts a time string like HH:MM:SS.
This is helpful if you need a specific state of the component.

<sbb-clock now="23:23:00"></sbb-clock>

Properties

Name Attribute Privacy Type Default Description
now now public SbbTime | null null Define a specific time which the clock should show statically.