Basiselemente

Icons

Icons bieten eine effektive Möglichkeit, mit anderen zu kommunizieren. DPDHL Group Icons veranschaulichen unsere Botschaft, heben Inhalte hervor und bilden Funktionen ab. In diesem Guide erfahren Sie mehr über den klaren Stil und die flexible Anwendung unserer Icons. Wenn Sie Icons einsetzen möchten, so finden Sie diese in der separaten, übersichtlich gestalteten interaktiven Icon Library.

Icons
  • Grundlagen
  • Beispiele
  • Stil
  • Anwendungsbereiche
  • Icons in Illustrationen
  • Andere Anwendungen von Icons
  • Downloads

Grundlagen

Unser Icon-Stil ist klar, einfach und zweidimensional. Innerhalb eines Icons können Ecken sowohl abgerundete als auch spitz zulaufend sein. Die meisten Icons sind durch eine effektvolle kleine Unterbrechung gekennzeichnet. Diese schafft einen unverwechselbaren Stil. Icons zeigen nur so viele Details wie nötig und sind in der Regel in schwarz eingefärbt. Alternativ können sie auch in Weiß-, Rot- oder Grautönen oder unser Dunkelgrün für nachhaltige Themen gestaltet werden. Wir unterscheiden zwischen Piktogrammen und UI Icons. Piktogramme werden narrativ und illustrativ eingesetzt, während UI Icons als funktionale und interaktive Elemente im Interface verwendet werden. Laden Sie Ihre gewünschten Icons einfach aus der separaten › Icon Library herunter.

Können wir helfen?

  • Sie benötigen ein neues Icon, das nicht in der Icon Library enthalten ist?

  • Sie haben ein Icon für ein Projekt erstellt und würden es gerne in die Library aufnehmen?

Wenden Sie sich mit Ihrer Anfrage gerne an das Group Brand Services-Team (GBS-Team), das Sie bei den nächsten Schritten unterstützt: GroupBrandServices@dpdhl.com

Beispiele

Stil

Ein charakteristisches Element unserer Icons ist die kleine Unterbrechung, die vom DHL Logo und dem Posthorn der Deutschen Post inspiriert wurde. Charakteristisch ist außerdem die Kombination aus abgerundeten und spitzen Ecken. Alle Icons sind schlicht und reduziert gehalten, da die Funktion und Wiedererkennung – auch in kleiner Größe – im Vordergrund steht. Das gilt ganz besonders für unsere UI Icons.

Piktogramme

  • Piktogramme werden narrativ und illustrativ eingesetzt.

  • Ihr Stil ist flächig, kraftvoll und ausgewogen.

  • Die Motive sind frontal oder von der Seite zu sehen, oder sie zeigen eine geringe Perspektive.

  • Abgerundete und spitze Ecken werden kombiniert.

  • Piktogramme werden auf Basis eines Rasters mit 48 × 48 px in sich ähnelnden einfachen Formen erstellt.

  • Als charakteristisches Element und wenn es zum Motiv passt, wird horizontal oder vertikal eine Unterbrechung von 2 px eingefügt.

UI Icons

  • Bei UI Icons steht die Funktion im Vordergrund. Sie werden in kleinen Größen verwendet. Darum unterscheiden sich einige ihrer Merkmale von denen der Piktogramme, auch wenn sie diesen optisch ähneln.

  • UI Icons sind sehr schlicht und reduziert gehalten, und sie weisen weniger abgerundete Ecken auf.

  • Sie werden auf Basis eines Rasters mit 48 × 48 px in sich ähnelnden einfachen Formen erstellt.

  • Wenn das Motiv es erfordert, sind auch Icons mit Konturen möglich. Die Stärke der Konturen beträgt dann 4 px.

  • Eine Unterbrechung von 2 px kann als charakteristisches Element horizontal oder vertikal eingefügt werden. Er ist jedoch nicht zwingend erforderlich.

  • Icons, die in einem aktiven und deaktivierten Status zur Verfügung stehen, erhalten im deaktivierten Status eine Kontur mit der Stärke von 2 px.

Dos and Don’ts

Anwendungsbereiche

Farben
Icons sollten in schwarz abgebildet werden. Alternativen sind Weiß, Schwarz oder Grautöne.

Wenn Icons sich auf Themen oder Produkte unseres Umweltschutzprogramms GoGreen oder allgemein nachhaltige Themen beziehen, kann auch Dunkelgrün verwendet werden.

 

Hintergrundfarben
Icons können auf einem postgelben, grauen oder weißen Hintergrund platziert werden.

Hintergrundformen
Icons dürfen – vom Quadrat bis Kreis – auf unterschiedlichen geometrische Formen platziert werden. Alternativ werden sie ohne Umform frei auf dem Format platziert.

 

Abstände
Achten Sie auf einen deutlich erkennbaren Abstand zwischen Icons und anderen Elementen, wie beispielsweise Text.

 

Größe
Die Größe der Icons kann variieren. Da sie auf einem Raster mit 48 × 48 px erstellt werden, sind sie perfekt geeignet für Bildschirme mit 48 × 48 px oder 24 × 24 px, oder anderen geraden Vielfachen von 48 px wie 96 × 96 px.

 

Icons in Illustrationen

Zur Unterstützung der Bildaussage dürfen Icons auch innerhalb von Illustrationen eingesetzt werden. Dabei können sie einzeln oder zusammen mit anderen Icons verwendet werden und in unterschiedlichen Größen und Farben erscheinen. Erlaubt sind Schwarz, DHL Rot, Postgelb, Grautöne, Weiß und Abstufungen von Postgelb. Illustrationen werden üblicherweise auf einem weißen Hintergrund oder auf dem postgelben Verlauf platziert. Die Form der Icons darf nicht verändert werden.

Von informativ und einfach bis emotional und komplex.

Andere Anwendungen von Icons

Interface
Verwenden Sie Icons als Bestandteil eines Buttons oder um eine Funktion, einen Befehl, eine Datei oder ein Gerät zu kommunizieren.

Nachhaltige Produkte und Lösungen
Für nachhaltige Produkte und Lösungen können die bereits vorhandenen Icons in dunkelgrüner Farbe verwendet werden. 

Beispiele:

  • ein grünes Paket für „Ökopaket“ von Post & Paket Deutschland

  • ein grünes Schiff für „OFR SMF“ von DGF

  • ein grünes Flugzeug für „DSC/EXP SAF“ von DSC

  • ein grünes Lagergebäude für „Green Warehouse“ von Freight

  • ein grüner LKW für „Send Green“ und „Green Transport“ von DSC und Freight

Downloads

Wenn Sie Icons einsetzen möchten, so finden Sie diese in der separaten, übersichtlich gestalteten interaktiven › Icon Library.