Eine für Smartphones optmierte Version wird in Kürze verfügbar sein
4.0.Ressourcen    4.5.Icons

4.5.Icons

Das Daimler Icon-Set enthält über 600 Icons, die in normaler und fetter Strichstärke verfügbar sind. Sie decken Themen wie Schnittstellen-Hauptbestandteile, Mobilität, Geschäftliches und Reisen ab. Diese Icons gibt es in drei Sets:

  1. Geschäftliches und Mobilität
  2. Digital und Technologie
  3. Verschiedenes

Siehe hierzu Punkt 2.3. Icons, um eine Übersicht über alle verfügbaren Icons zu sehen. Jedes dieser Sets ist als ein Icon-Font zur einfachen Verwendung in Designanwendungen und, bei Bedarf, auf Webseiten und Apps erhältlich. Die Verwendung eines Icon-Font anstelle einzelner Dateien erleichtert die Verteilung und Aktualisierung des vollständigen Icon-Sets. Installieren Sie einfach die neue Version des Icon-Font und alle Ihre Design-Dateien werden mit den korrekten Icons aktualisiert.

Die Icon-Fonts werden von Daimler geführt, als Werkzeug dafür wird Icomoon verwendet.

Some Image
    4.0.Ressourcen      4.5.Icons      4.5.1.Download der Daimler Icon-Font als ZIP-Archiv

    4.5.1.Download der Daimler Icon-Font als ZIP-Archiv

    4.0.Ressourcen      4.5.Icons      4.5.2.Installation

    4.5.2.Installation

    1. Entpacken der ZIP-Datei. Die Icons sind in sechs Icon-Fonts gepackt, bestehend aus drei Icon-Sets, jeweils in normaler und fetter Strichstärke. Siehe 2.3. Icons-Seite, um herauszufinden, in welchem Set Sie Ihr Icon finden.
    2. Die Fonts für Verwendung auf Desktops installieren. Finden Sie im "/fonts" Verzeichnis die ".ttf"-Versionen der Icon-Fonts. Auf einem Mac-Computer reicht ein Doppelklick auf den Font und dann auf "install".

       

      Daimler-Business-Mobility-Bold.ttf
      Daimler-Business-Mobility-Light.ttf
      Daimler-Digital-Tech-Bold.ttf
      Daimler-Digital-Tech-Light.ttf
      Daimler-Miscellaneous-Bold.ttf
      Daimler-Miscellaneous-Light.ttf

       

    4.0.Ressourcen      4.5.Icons      4.5.3.Nutzung

    4.5.3.Nutzung

    Bei einem macOS-Betriebssystem können Sie das Font Book (Schriftenverwaltung) nutzen, um alle im Font enthaltenen Glyphen zu sehen, indem Sie "cmd + 2" betätigen oder die zweite Option in der oberen linken Ecke des Font Book auswählen. Sie können einzelne Icons im Font Book kopieren und in Ihr Design einfügen. Vergessen Sie nicht, nach dem Einfügen des Icon "custom icon font" in Ihrem Design auszuwählen.

    Some Image

      Bei Windows oder Linux: öffnen Sie nach dem Installieren des .ttf Font die Datei demo.html (in der von Ihnen heruntergeladenen ZIP-Datei enthalten), um eine Liste der Glyphen in Ihrem Font zu sehen. Das unten rechts bei jeder Glyphe stehende Textfeld enthält ein Zeichen (das möglicherweise unsichtbar ist). Sie können dieses Zeichen in jede Desktop-Anwendung kopieren und darin nutzen, die eine Texteingabe erlaubt, und dann den Custom Icon-Font auswählen, um es anzuzeigen. Die vollständige Dokumentation finden Sie in der offiziellen Dokumentation Icomoon Usage Documentation.

      Some Image
        4.0.Ressourcen      4.5.Icons      4.5.4.Nutzung als Webfonts

        4.5.4.Nutzung als Webfonts

        Die "/style.css"-Datei enthält alle benötigten CSS-Stile. Kopieren Sie den gesamten Ordner /fonts und die Datei "/styles.css" in das statische Anlagenverzeichnis Ihres Projekts (oder wo immer Sie Frontend-Assets oder Anbieterdateien speichern). Fügen Sie in jede Vorlage oder Seite, für die Sie das Daimler Icon-Set verwenden wollen, einen Verweis auf die kopierte Datei /styles.css ein.