Farben (2015 bis 2021)
CI-Farben der Fakultäten
Einrichtung | Web Farben/Digitales gemäß WCAG II Level AAA in HEX | ||||
---|---|---|---|---|---|
Hellste | Heller | Basisfarbe | Dunkler | Dunkelste | |
FAU / ZUV | #dde5f0 | #8fb1ef | #003366 | #24598f | #1f4c7a |
Philosophische Fakultät und Fachbereich Theologie | #f3eedf | #d9c689 | #A36B0D | #805000 | #553500 |
Rechts- und Wirtschaftswissenschaftliche Fakultät | #ede7de | #c5ac94 | #8d1429 | #690013 | #42000c |
Medizinische Fakultät | #eaf3fc | #bfd6f5 | #0381A2 | #026480 | #014e63 |
Naturwissenschaftliche Fakultät | #e5efea | #aacfbd | #048767 | #006e53 | #00533f |
Technische Fakultät | #ebecee | #d2d5d7 | #6E7881 | #53606b | #3b4956 |
Einsatz in den FAU Themes
Die Farben kommen zum Einsatz bei den Fakultätsthemen und dem EInrichtungstheme:
- Die Basisfarbe wird verwendet für: Überschriften, (textuelles) Logo, Hauptmenü, Links, Buttons, Weiter-/Zurück-Pfeile, sowie weitere interaktive Bedienelemente, Footer-Hintergrund, Kontrastränder bei Accordions und Zitaten
- Die hellere Abstufung der Basisfarbe wird verwendet für: Startfarbe für den Farbverlauf im Hero (Breadcrumb-Leiste), Hintergrundfarbe bei Slidertexten
- Die hellste Abstufung der Basisfarbe wird verwendet für: Linkfarbe für Elemente des Hauptmenüs ab zweiter Ebene, Randfarbe für Trennlinien
- Die dunklere Abstufung der Basisfarbe wird verwendet für: Bildunterschriften, Tabellenüberschriften, Randfarbe für Elemente des Hauptmenüs ab zweiter Ebene
- Die dunkelste Abstufung der Basisfarbe wird verwendet für: Hoverfarbe in Menüs, Hoverfarbe bei Buttons und weiteren interaktiven Elementen
Ein geeignetes Online-Testtool für die Berechnung der Kontraste findet sich auf der Website contrastchecker.com.
Zugrunde liegende Normen der WCAG 2.1
- Guideline 1.4.3 Contrast (Minimum): The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: (Level AA)
- Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
- Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
- Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.
- Guideline 1.4.6 Contrast (Enhanced): The visual presentation of text and images of text has a contrast ratio of at least 7:1, except for the following: (Level AAA)
- Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 4.5:1;
- Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
- Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.
Es wird WCAG Level AAA, bzw. ab WCAG 3.0 der „Gold-Standard“ angestrebt.
Berechnungsgrundlage
Die Print-Farbe wird als Eingabefarbe im Kontrastfinder von Tanaguru verwendet. Die dazu in der Berechnung verwendete Hintergrundfarbe ist Weiß. Bei der Option Ratio sollte der Wert 4.5 verwendet werden; Bei der Option, welche Ergebnisfarbe berechnet werden soll, wird die Option „valid colors and very close to initial color“ verwendet. Die erste Ergebnisfarbe wird als Basisfarbe für Digitales und Web genommen.
Einrichtung | Print Farben | Web Basisfarbe | |
---|---|---|---|
Print RGB | Print HEX | Web-Farbe HEX | |
FAU / ZUV | 0/56/101 | #003865 | #003366 |
Philosophische Fakultät und Fachbereich Theologie | 201/147/19 | #c99313 | #A36B0D |
Rechts- und Wirtschaftswissenschaftliche Fakultät | 141/20/41 | #8d1429 | #8d1429 |
Medizinische Fakultät | 0/177/235 | #00b1eb | #0381A2 |
Naturwissenschaftliche Fakultät | 0/155/119 | #009b77 | #048767 |
Technische Fakultät | 152/164/174 | #98a4ae | #6E7881 |
Grauwerte
Für allgemeine Bereiche, wie dem Meta-Teil, Rahmen oder Tabellenhintergründen, werden Grauwerte verwenden.
Standard Grauwert | #e9edf2 |
---|---|
Standard Rahmenfarbe | #dfe6ec |
Standard Bereichstrenner | #f5f7f9 |
Schriftfarben
Die Überschriften werden im Inhaltsbereich gemäß der CI-Farbe gefärbt.
Für den normalen Textbereich gibt es folgende Farbvarianten:
Standard Text | #444 |
---|---|
Standard Text Print | #000 |
Hervorgehobener Text hell | #797676 |
Hervorgehobener Text für Hinweise | #a71c18 |