Direkt zum Inhalt
Modules
 
Icons beeinflussen die Usability und prägen die ästhetische Qualität aller elektronischen Medien. Für die Gestaltung unserer Medien werden eigene 
DB Icons mit unserer einheitlichen Zeichensprache und Systematik eingesetzt.

Vorlagen für die DB Icons stehen lizenzfrei zum Download zur Verfügung. 
Sie liegen im SVG-Format vor und können verlustfrei skaliert bzw. nach Vorgabe angepasst werden.

Zum differenzierten Einsatz für unterschiedliche Inhalte, funktionale Anwendungen oder verschiedene Medien steht ein ganzes Sortiment an Gestaltungsmöglichkeiten wie Konturen, Farben, Helligkeitsverläufe und Schlagschatten zur Verfügung.

Auf dieser Seite finden Sie die DB Icons für die wichtigsten Funktionen
von elektronischen Anwendungen. DB Dashboard Icons für individuelle Anwendungszwecke finden Sie unter:

 

Die Downloads werden schrittweise um weitere Icons ergänzt. Bei Fragen wenden Sie sich bitte an das Team Corporate Design.

 
Auf einen Blick:
 

Icon Systematik

 
 

Hinweis: Die volle Funktionalität des Tutorials ist nur 
bei Verwendung aktueller Browser gewährleistet.

 

Der Aufbau der DB Icons folgt einem neu entwickelten System.
Jedes Icon besteht aus einem Symbol und einer im festen Verhältnis zum Symbol stehenden Grundfläche (1)
Die Grundfläche ist quadratisch und hat stumpfe Ecken.
Der Gestaltung liegt ein gemeinsames, pixelbasiertes Gestaltungsraster (2) zugrunde. Die pixelgenaue Konstruktion des Icons ermöglicht eine optimale (randscharfe) Wiedergabe auf Displays und Bildschirmen. 

Für den Einsatz der DB Icons werden bestimmte Abbildungsgrößen besonders empfohlen, in denen die pixelgenaue Konstruktion erhalten bleibt und in denen eine verlustfreie Darstellung des Icons gewährleistet ist.

Für den Einsatz der DB Icons steht
ein Sortiment an Gestaltungs-möglichkeiten zur Verfügung.

Die Icons können als alleinstehende Symbole oder mit einer Grundfläche eingesetzt werden.
Es sind Positiv- oder Negativvarianten möglich. Auf die Grundfläche können nach festen Vorgaben Stilelemente wie Konturlinien, Schlagschatten oder Helligkeitsverläufe (3) angewendet werden. Auf modische, kurzlebige visuelle Effekte wie eine pseudorealistische Darstellung durch Nachahmung von Oberflächen und Texturen wird bewusst verzichtet. 
Als Farben werden die DB Grautöne verwendet. Für Icons, die mit Funktionen belegt sind, stehen zusätzlich die Web-Rottöne und DB Rot zur Verfügung.

Einheitliche Zeichen- und Formensprache
Die Symbole unserer DB Icons orientieren sich an bereits „gelernten“ Zeichen und sind selbsterklärend und allgemein verständlich (4).
Die Symbole sind mit Fokus auf das Wesentliche gestaltet und damit schnell zu erfassen. Sie sind nach einem System geometrisch konstruiert, ihre Form darf nicht verändert werden. 

 
CD-Regeln:
 
Form und Aufbau der DB Icons
 

Die Form der DB Icons darf nicht verändert werden.
 
Die Icons sind vektorbasiert als SVG-Dateien angelegt.
Sie können generell ohne Qualitätsverlust skaliert werden

und sind im Gegensatz zu pixelbasierten Dateiformaten für die Darstellung von Bildschirm-Inhalten auf ver- schiedensten Endgeräten besonders geeignet. Zusätzlich stehen die Icons im PNG-Format zur Verfügung.

 

Vektordateien auf dem Bildschirm
Auch Vektordateien werden bei der Darstellung auf dem Bildschirm in Form von Pixeln wiedergegeben, was bei Objektkanten, die nicht passgenau im Pixelraster liegen, zu Unschärfen führen kann, da weitere Pixel ergänzt werden.

   Zum Vergleich:  Nur bei einer passgenauen Ausrichtung des Objekts am...

Zum Vergleich: Nur bei einer passgenauen Ausrichtung des Objekts am Pixelraster wird das Icon optimal wiedergegeben.

 

Gestaltungsraster

Die Gestaltung der DB Icons ist auf eine optimale Darstellung am Bildschirm ausgerichtet. Den DB Icons liegt ein pixelbasiertes Raster von 32x32 Pixeln mit einer maximalen Symbolgröße von 24x24 Pixeln zugrunde. Die pixelgenaue Konstruktion sowie das feste Verhältnis des Symbols zur umgebenden Grundfläche ermöglichen eine optimal scharfe Wiedergabe auf Displays und Bildschirmen (trotz geglätteter Darstellung)
Gestaltungsraster
 

Abbildungsgrößen

Um eine optimale Darstellung zu gewährleisten empfehlen wir für die Verwendung der DB Icons fünf Abbildungsgrößen, die sich in Größenabstufungen von jeweils 25% aus der Basisgröße ergeben. In diesen Abbildungsgrößen bleibt eine pixelgenaue Konstruktion erhalten. Benötigte Zwischengrößen können vom Anwender als pixeloptimierte Variante erstellt werden.
   Empfohlene Abbildungsgrößen  für eine optimale Darstellung

Empfohlene Abbildungsgrößen für eine optimale Darstellung

 

Hinweis
Informationen zum Gestaltungsraster und den Abbildungs-größen der DB Dashboard Icons finden Sie unter:

 

Icon-Vorlagen
Die verktorbasierten SVG-Dateien setzen sich aus Grundfläche und Symbol zusammen. Positive Icon-Vorlagen sind mit transparenter Grundfläche angelegt.
 
Die Vorlagen können durch zertifizierte Agenturen bzw. über dafür ausgebildetes Personal mit spezieller Software wie Adobe Illustrator bearbeitet oder über CSS für den Bedarf angepasst werden.

Icon Vorlagen
 
 
 
Gestaltungsvarianten
 

Je nach Bedarf sind für den Einsatz der DB Icons 
folgende Gestaltungsvarianten definiert.

 

Konturlinien

Die Grundfläche des Icons kann um eine Konturlinie in der Farbe des Symbols ergänzt werden.
Die Konturlinie wird nach außen ausgerichtet. 
Konturlinien
 

Schlagschatten

Um Icons vom Untergrund abzuheben und von anderen Gestaltungselementen zu differenzieren, kann die Grundfläche durch eine einfache Schattenkante geringer Tiefe ergänzt werden.
Auf einen Weichzeichnungseffekt wird dabei verzichtet. Das Icon-Symbol wird ohne Schatten eingesetzt.
Schlagschatten
 

Helligkeitsverläufe

Um eine lebendige, objekthafte Wirkung zu erreichen, kann die Grundfläche des Icons mit einem von oben nach unten gehenden Helligkeitsverlauf gestaltet werden.
Der Helligkeitsunterschied beträgt dabei maximal 30%. Auf das Icon-Symbol wird kein Verlauf angewendet.
Verläufe
 

Farben

Es werden die DB Grautöne und Weiß verwendet. Für Icons, die mit Funktionen versehen sind, stehen außerdem DB Rot und weitere Rottöne zur Verfügung. Farben können auf Symbol und Grundfläche angewendet werden.
In Absprache mit GNM 11 können weitere Farben eingesetzt werden.

Farben
 

Mehrfarbige Symbole

Um die Aussage des Symbols zu verstärken oder das Icon um zusätzliche Informationen zu ergänzen, können die Symbole mehrfarbig unter Hinzunahme von DB Rot als Auszeichnungsfarbe gestaltet werden. Damit eine gleichbleibend prägnante Darstellung gewährleistet bleibt, werden nur eigenständige Formen innerhalb des Iconsymbols mit DB Rot gekennzeichnet. Ein ausreichender Kontrast des mehrfarbigen Symbols zur Grundfläche ist nur in einigen Gestaltungsvarianten möglich.

Mehrfarbige Symbole
 

Kennzeichnend für die Gestaltung ist ein Verzicht auf eine pseudorealistische Darstellung durch Nachahmung von Oberflächen und Texturen. Unnötige und übertriebene Effekte kommen im Sinne eines langfristig wirksamen Auftritts ebenfalls nicht zum Einsatz. Ausnahmen sind Projekt- oder Kampagnenthemen, die mit dem nötigen „Zeitgeist“ ausgestattet sein müssen, um eine zielgruppengerechte Ansprache und publikumswirksame Außenwirkung über einen begrenzten Zeitraum zu erwirken.

Unnötige Effekte
 
 
DB Icons elektronische Medien
 

Alle Downloads beinhalten die kompletten DB Icons für elektronische Medien 
in der gezeigten Gestaltungsvariante, in den Formaten SVG und PNG.

 
Icon, positiv
Icon, negativ
150505_icon_weiss
 

Download: DB Icons eM 001-103
DB Grau positiv v1.4

Dateiformat: ZIP
Dateigröße: 7 MB

Download: DB Icons eM 001-103
DB Grau negativ v1.4

Dateiformat: ZIP
Dateigröße: 7.1 MB

Download: DB Icons eM 001-103
Weiß v1.4

Dateiformat: ZIP
Dateigröße: 7 MB

 
Icon mit Kontur
Icon in DB Rot
Icon, negativ auf DB-Rot
 

Download: DB Icons eM 001-103
DB Dunkelgrau Kontur v1.4

Dateiformat: ZIP
Dateigröße: 7.5 MB

Download: DB Icons eM 001-103
DB Rot positiv v1.4

Dateiformat: ZIP
Dateigröße: 5.7 MB

Download: DB Icons eM 001-103
DB Rot negativ v1.4

Dateiformat: ZIP
Dateigröße: 7.3 MB

 
Icon mit Verlauf
Icon mit Schatten
Icon mit Schatten, negativ
 

Download: DB Icons eM 001-103
auf Verlauf negativ v1.4

Dateiformat: ZIP
Dateigröße: 7.3 MB

Download: DB Icons eM 001-103
mit Schatten positiv v1.4

Dateiformat: ZIP
Dateigröße: 7.4 MB

Download: DB Icons eM 001-103
mit Schatten negativ v1.4

Dateiformat: ZIP
Dateigröße: 7.5 MB

 
DB Icons, outline positive
151021_icon_negativ-outline
 

Download: DB Icons eM 001-103
Outline positiv v1.4

Dateiformat: ZIP
Dateigröße: 7.3 MB

Download: DB Icons eM 001-103
Outline negativ v1.4

Dateiformat: ZIP
Dateigröße: 7.4 MB

 

Stand: 20.04.2017 (Version 1.4) – Auswahl wird regelmäßig erweitert

 
DB Icons Übersicht
 
Icon Überischt 073 bis 103
 
 
Anprechpartner
Name

Fragen zum Inhalt dieser Seite?

E-Mail

marke@deutschebahn.com

veröffentlicht:
30.03.2015