Neue Werte für die R+V-Farben zur Erfüllung der Kontrastvorgaben der WCAG

Farben

Die R+V-Farben basieren auf der Markenpositionierung und den R+V-Markenwerten. Das dunkelblaue Fundament der Marke steht für Solidität, das orangene Highlight in unseren Botschaften zeigt die Nähe zur genossenschaftlichen Finanzgruppe. Mint ist unsere Interaktionsfarbe und wird für digitale Elemente und auffällige Call-to-Actions verwendet. Unsere Sekundärfarben Braun und Grün gehen auf die Ursprünge der genossenschaftlichen Idee zurück und kommen aus der Landwirtschaft.

Erfüllung der Kontrastvorgaben der WCAG

Die Farbwerte der R+V-Farben mussten angepasst werden, damit sie die aktuellen Kontrastvorgaben der WCAG erfüllen: An den verfügbaren Grundfarben sowie am Designsystem ändert sich dadurch nichts, aber nahezu alle Farbwerte wurden zugunsten einer einheitlichen Farbbasis für Digital und Print angepasst!

So ist es digital möglich, die markentypische R+V-Farbgebung in helle oder dunkle Modi zu überführen.

 

Hier sieht man die Verortung der Farben auf den entsprechenden digitalen Skalen.
Hier sieht man die Verortung der Farben auf den entsprechenden digitalen Skalen.

Nahezu alle bisherigen Farbwerte sind auf HEX-, RGB- und CMYK-Basis verändert worden, am sichtbarsten sind die Anpassungen beim R+V Mint, R+V-Orange und dem Grünspektrum.

Hauptfarben

Die Hauptfarben der Marke R+V sind Dunkelblau, Weiß, Orange und Mint. Dunkelblau und Weiß bilden die Grundlage und stehen für Solidität. Orange betont die Headlines und zeigt unsere Nähe zur genossenschaftlichen Finanzgruppe. Mint differenziert die Marke im Wettbewerb und hebt wichtige Inhalte durch Call-to-Action- und Interaktionselemente hervor.

Dunkelblau

CMYK 100, 80, 0, 60
CMYK für TZ 95, 67, 4, 53
RGB 0, 25, 87
HEX 001957
PANTONE 2766 C, 2757 U
RAL 5022

Weiß

CMYK 0, 0, 0, 0
RGB 255, 255, 255
HEX FFFFFF

Orange hell
Highlight in der Headline
auf dunklen Hintergründen

CMYK 0, 50, 100, 0
RGB 247, 149, 6
HEX F79506
PANTONE 2012 C

Orange dunkel 
Highlight in der Headline
auf hellen Hintergründen

CMYK 0, 70, 100, 0
RGB 235, 101, 4
HEX EB6504
PANTONE 716 C

Mint hell
Interaktion
auf dunklen Hintergründen

CMYK 65, 0, 22, 0
RGB 0, 220, 220
HEX 00DCDC
PANTONE 311 C

Mint dunkel
Interaktion
auf hellen Hintergründen

CMYK 75, 10, 25, 0
RGB 16, 157, 168
HEX 109DA8
PANTONE 2220 C

 

Anwendungsbeispiele
Beispielhafter Einsatz der R+V-Primärfarben in Anzeigen

Sekundärfarben

Das Sekundärfarbspektrum aus Braun- und Grüntönen steht für die Regionalität und den Ursprung der R+V: die genossenschaftliche Idee.

Die Farben, die aus der Landwirtschaft abgeleitet sind, werden auf einer tieferen Markenebene eingesetzt, beispielsweise auf Innenseiten von Broschüren und Leaflets sowie in Infografiken. Sie tragen dazu bei, die Marke zu prägen und gleichzeitig Inhalte klar und übersichtlich zu strukturieren.

Sand

CMYK 0, 5, 20, 0
RGB 255, 244, 224
HEX FFF4E0


PA,NTONE 9185 C, 9185 U
RAL 9001

Grün

CMYK 10, 0, 20, 0
RGB 240, 248, 227
HEX F0F8E3

Braun 1

CMYK 0, 15, 35, 0
RGB 251, 229, 199
HEX FBE5C7

Grün 1

CMYK 20, 0, 40, 0
RGB 218, 241, 171
HEX DAF1AB 

Braun 2

CMYK 10, 30, 50, 0
RGB 234, 190, 141
HEX EABE8D
 

Grün 2

CMYK 30, 0, 60, 0
RGB 197, 232, 120
HEX C5E878

 

Braun 3

CMYK 20, 55, 75, 10
RGB  196, 125, 71
HEX C47D47

Grün 3

CMYK 40, 0, 80, 0
RGB 167, 213, 76
HEX A7D54C
PANTONE 3561 C

 

Braun 4

CMYK 30, 65, 80, 20
RGB 164, 95, 51
HEX A45F33

 

Grün 4

CMYK 60, 20, 100, 0
RGB 117, 154, 3
HEX 759A03
PANTONE 2277 C

Braun 5

CMYK 40, 65, 80, 40
RGB 88, 55, 32
HEX 583720

 

Grün 5

CMYK 70, 30, 100, 20
RGB 91, 122, 3
HEX 5B7A03

 

Blautöne für Infografiken und Illustrationen

Um grafisch komplexere Strukturen abbilden zu können, gibt es ein erweitertes Farbspektrum. Eine weitere Anwendung finden die Blautöne in Illustrationen.

Blau 1

CMYK 30, 5, 5, 0
RGB 190, 224, 245
HEX BEE0F5

 

Blau 2

CMYK 55, 15, 10, 0
RGB 125, 181, 215
HEX 7DB5D7

 

Blau 3

CMYK 80, 45, 15, 0
RGB 56, 117, 166
HEX 3875A6

 

Blau 4

CMYK 90, 60, 25, 10
RGB 21, 87, 132
HEX 155784

 

 

Grautöne für Struktur im User-Interface

Als neutrale Zusatzfarben helfen Grautöne bei der Strukturierung von Inhalten und Komponenten im digitalen Kontext. Sie erleichtern die Nutzerführung, indem sie Zustände von UI-Elementen markieren und funktionale Bereiche klar innerhalb des User-Interfaces hervorheben.

 

Grau 1

CMYK 0, 0, 0, 5
RGB 245, 245, 245
HEX F5F5F5

 

Grau 2

CMYK 0, 0, 0, 10
RGB 236, 236, 236
HEX ECECEC

 

Grau 3

CMYK 0, 0, 0, 35
RGB 199, 199, 199
HEX C7C7C7

 

Grau 4

CMYK 0, 0, 0, 55
RGB 136, 136, 136
HEX 888888

Grau 5

CMYK 0, 0, 0, 75
RGB 112, 112, 112
HEX 707070

 

   

 

Funktionsfarben

Um Hinweise und Verfügbarkeiten in Tabellen beziehungsweise Fehler in Formularen zu kennzeichnen, werden Funktionsfarben verwendet. Diese Farben, insbesondere Rot, finden lediglich in diesem Bereich Anwendung.

Rot 1 für helle Hintergründe
CMYK 0, 80, 60, 0
RGB 255, 76, 76
HEX FF4C4C

Rot 2 für dunkle Hintergründe
CMYK 0, 60, 35, 0
RGB 255, 132, 132
HEX FF8484

Grün für helle Hintergründe
CMYK 60, 20, 100, 5
RGB 117, 154, 3
HEX 759A03

Grün für dunkle Hintergründe
CMYK 50, 0, 100, 0
RGB 142, 188, 39
HEX 8EBC27

Anwendungsbeispiele
Farben - Anwendungsbeispiele
Beispielhafter Einsatz der Funktionsfarben in Formularen und Tabellen
Farben als Farbbibliothek für Adobe-Programme