EPS / PNG 2.04MB
Primärfarben
Die primäre Farbpalette ist Schwarz und Weiss kombiniert mit Kupfer. Schwarz und Weiß sind einfach und sorgen für den größtmöglichen Kontrast und die beste Lesbarkeit. Die Highlight-Farbe Kupfer, die als linearer Farbverlauf dargestellt wird, spiegelt die Kupferspulen im Smart Chip wider und stellt eine Verbindung zwischen unserer Grafik und dem Chip her.
Schwarz
CMYK (Reiches Schwarz)
60/40/40/100
Hex
#000000
Weiss
CMYK
0/0/0/0
Hex
#ffffff
Kupfer
CMYK
0/46/78/0 > 32/60/88/35
Hex
#ffa041 > #875525
Farbverläufe & Kurven
Wo immer möglich, verwenden wir Farbverläufe in Kombination mit einem zentralen Designelement, dem Kurven. Hier lernst du, wie man sie herstellt und benutzt.
Kurven
Die Kurven werden hauptsächlich für Hintergründe verwendet. Sie geben ihnen mehr visuelles Interesse, Tiefe und ein Gefühl von Bewegung.
Sie halten auch alles zusammen, wenn du anfängst, die Sekundärfarben zu verwenden. Mehr dazu später.
Die Kurven werden durch Skalieren, Drehen und Beschneiden des Chip-Icons gemacht. Die Grösse, die Rotation und der Beschnitt sind dir überlassen und sollten bei jedem neuen Design anders sein.
Die Kurven werden immer auf einem Hintergrund platziert. Der Hintergrund verwendet denselben Farbverlauf wie die Kurven, nur in die entgegengesetzte Richtung.
Die Richtung der Farbverläufe ist nicht in Stein gemeißelt. Du kannst sie bei jedem neuen Entwurf frei ändern. So bleiben sie lebendig und frisch.
Du musst nicht den gesamten Bereich des Farbverlaufs von Anfang bis Ende ausnutzen. Du kannst auch nur einen Teil davon "heranzoomen". Dadurch wird die Farbpalette erweitert, während unsere erkennbaren Farben erhalten bleiben.
Achte aber darauf, dass er noch als Farbverlauf zu erkennen ist. Nimm nicht einen Teil, der so klein ist, dass er wie eine einzige Farbe aussieht.
Primärfarben im Einsatz
Sekundärfarben
Die Sekundärfarben unterstützen und erweitern die Primärpalette. Sie sollen den Designs Abwechslung verleihen und unserer visuellen Sprache Leben einhauchen.
Diese Farben ersetzen Kupfer in der Palette, wenn du sie verwendest. Es gelten die gleichen Regeln für Verläufe und Kurven.
Mische keine verschiedenen Farben auf derselben Seite.
Cooles Lila
CMYK
45/54/0/0 > 89/84/0/0
Hex
#9e81c3 > #42399d
Warmes Blau
CMYK
79/24/6/2 > 90/69/0/0
Hex
#0393bc > #004cd5
Elektrisch Blau
CMYK
65/0/0/0 > 70/54/0/0
Hex
#23c8fe > #647cff
Hübsches Rosa
CMYK
5/54/34/0 > 0/85/69/0
Hex
#ea9091 > #ed4343
Lebendiges Orange
CMYK
0/46/78/0 > 0/86/70/0
Hex
#ffa041 > #fc3a3c
Ruhiges Grün
CMYK
62/0/92/0 > 86/29/88/16
Hex
#71b541 > #197642
Berücksichtige die Stimmung oder den Ton deines Designs, wenn du eine Farbe auswählst. Jeder Farbverlauf vermittelt ein anderes Gefühl. Zum Beispiel, Cooles Lila erweckt ein Gefühl von Ruhe und Raffinesse und ist daher ideal für entspannte oder introspektive Themen. Auf der anderen Seite, Elektrisch Blau ist lebendig und energiegeladen, perfekt für dynamische oder aktionsorientierte Inhalte. Denke über die Botschaft nach, die du vermitteln willst, und wähle die Farbe, die diese Aussage am besten unterstützt.
Verwendete Sekundärfarben
Neue Farben herstellen
Die primäre Farbpalette Kupfer und die sekundäre Farbpalette sind so konzipiert, dass sie gut zusammen und in vielen verschiedenen Zusammenhängen funktionieren. Aber wenn kein Farbverlauf für dein spezielles Design geeignet ist, kannst du deinen eigenen erstellen.
Die Erstellung neuer Farbverläufe ist besonders nützlich, wenn du eine Überschrift mit Bildern kombinierst. In diesem Beispiel wird ein benutzerdefinierter Farbverlauf für die Überschrift verwendet, der perfekt zu dem Bild passt.
Die Farben wurden durch Sampling des Bildes und anschließende Erhöhung der Sättigung erstellt. So fügt sich der neue Farbverlauf in die bestehende Farbpalette ein.
Bei der Erstellung neuer Farben gibt es ein paar Regeln:
Übertreibe es nicht! Versuche, dich an die genehmigte Farbpalette zu halten und nimm nur dann neue Farben, wenn es nötig ist.
Erstelle keinen neuen Farbverlauf, der sich zu sehr an einen bestehenden anlehnt. Wenn eine bestehende Farbe funktioniert, bleib bei ihr.
Halte ihn Ton in Ton. Gehe nicht von Rot zu Blau, sondern von Hellrot zu Mittelrot.
Halte die Werte im Einklang mit den vorhandenen Farbverläufen. Wähle nicht zu gesättigt, gedämpft, hell oder dunkel.
Grundlegende Farbprinzipien
Wenn du ein neues Layout entwirfst, hast du die Wahl zwischen der Verwendung eines dunklen oder eines hellen Hintergrunds. Ein heller Hintergrund sieht sauber, offen und einladend aus. Ein dunkler Hintergrund erinnert an Technik, Eleganz und Kraft. Wähle den Hintergrund, der für dein Projekt, deine Botschaft und deine Zielgruppe am besten geeignet ist.
Egal, für welche du dich entscheidest, verwende die Branding-Farben, um das Layout aufzubrechen, bestimmte Informationen hervorzuheben, das Auge zu lenken oder einen Punkt zu betonen.
Springe nicht wild von einer Farbe zur nächsten. Strukturiere dein Design in Themen oder Kapitel, und weise jedem Kapitel eine eigene Farbe zu. Bleib innerhalb eines Kapitels bei dieser Farbe - das sorgt für Konsistenz und verhindert, dass die Seiten unübersichtlich werden.
Du kannst die Farben für Hintergründe, Untertitel, Icons oder jedes andere Element verwenden, bei dem ein Hauch von Farbe angebracht ist.
Um das Design sauber und kohärentzu halten, vermische nie verschiedene Farben auf einer einzelnen Seite.
Don’ts
Please avoid the following mistakes.
Verwende die Kurven nicht ohne einen Hintergrund.
Verwende die Kurven nicht auf einem Hintergrund mit einer anderen Farbe.
Mische nicht verschiedene Farben im gleichen Kontext.
