Designvorgaben ZfL

Um ein einheitliches Design zu erstellen, richten Sie sich bei der Gestaltung von Inhalten bitte nach den Designvorgaben des ZfL:

• Farbwerte
• Schriftarten
• Icons und Logos in der Medienbibliothek

Im Folgenden finden Sie einige Beispiele, die Sie entweder unverändert verwenden oder an Ihre Inhalte anpassen können.

1. Farbwerte

Für einen einheitlichen Look und den Wiedererkennungswert der Dachmarke “Universität zu Köln” sind folgende Vorgaben für die Farbgestaltung aller Inhalte zu berücksichtigen:

#005176

Uni-Blau – der primäre Farbton der Universität zu Köln

CSS-Klasse: kursnavi-blau

#80A6B9

50% Uni-Blau – der primäre Farbton der Universität zu Köln

CSS-Klassen: kursnavi-gruen; kursnavi-hellblau

#009DCC

Uni-Türkis – der sekundäre Farbton der Universität zu Köln

CSS-Klasse: kursnavi-tuerkis

#7FCDE4

50% Uni-Türkis – der sekundäre Farbton der Universität zu Köln

CSS-Klasse: kursnavi-tuerkis50

#FBBB33

ZfL-Lernen-Orange – zu verwenden für Icons und andere grafische Elemente

CSS-Klasse: kursnavi-gelb

#FCDC99

50% ZfL-Lernen-Orange

CSS-Klasse: kursnavi-hellgelb

#FEEBC1

30% ZfL-Lernen-Orange

CSS-Klasse: kursnavi-hellgelb30

#EF7872

80% Uni-Korall – optionale Zusatzfarbe

CSS-Klasse: kursnavi-corall

#F4AAA7

50% Uni-Korall – optionale Zusatzfarbe

CSS-Klasse: kursnavi-corall50

#F9CDCC

30% Uni-Korall – optionale Zusatzfarbe

CSS-Klasse: kursnavi-pink

#DC587F

80% ZfL-Berry – optionale Zusatzfarbe

CSS-Klasse: kursnavi-berry

#E896AD

50% ZfL-Berry – optionale Zusatzfarbe

CSS-Klasse: kursnavi-berry50

#CFCFCF

ZfL-Lernen Grau

CSS-Klasse: kursnavi-grau

#E6E6E6

ZfL-Lernen Hellgrau

CSS-Klasse: kursnavi-hellgrau

2. Schriftarten

Bitte verwenden Sie folgende Schriftarten und Punktgrößen für die angegebenen Textbausteine:

Überschrift

h1: Font “Open Sans”, Schriftgröße 30px; für den Teaser/Titel der Seite; erfolgt automatisch

Hauptüberschrift

h2: Font “Open Sans”, Schriftgröße 24px; für die Hauptüberschrift der Seite

Zwischenüberschrift

h3: Font “Open Sans”, Schriftgröße 18px; für alle Zwischenüberschriften

Absatztexte

Absatz: Font “Open Sans”, Schriftgröße 18px; für alle Absatztexte

3. Icons und Medienbibliothek

Für die visuelle Gestaltung und Gliederung Ihrer Inhalte finden Sie sämtliche Icons und eine große Zahl an Grafiken und Fotos in den verlinkten Medienbibliotheken:

Link zum Artikel der Icon-Übersicht

Icons als Vorlage zum Kopieren und Herunterladen

Link zum Artikel der Verwendung der Medienbibliothek

Grafiken und Fotos, die in die Gestaltung einbezogen werden können.