# Kleuren

Het design system van Rijkswaterstaat gebruikt een selectie kleuren van het Rijkshuisstijl kleurpalet en is uitgebreid met een aantal eigen kleuren specifiek voor Rijkswaterstaat.

# Primaire kleuren

Geel wordt voornamelijk gebruikt voor navigatie en primaire acties. Voor interacties en secondaire acties wordt Hemelblauw gebruikt. Koppen krijgen de kleur Logoblauw en tekst Rijkswaterstaat Grijs 3.

Rijkshuisstijl geel #f9e11e

Rijkshuisstijl hemelblauw #007bc7

Rijkshuisstijl logoblauw #154273

Rijkswaterstaat grijs 3 #222222

# Varianten

Voor tekstlinks wordt een contrastrijkere variant van Hemelblauw gebruikt voor een betere toegankelijkheid. In de hoofdnavigatie wordt Rijkswaterstaat lichtgeel bovenop de normale geel gebruikt om aan te geven welke pagina er op dat moment actief is.

Rijkswaterstaat hemelblauw #0073bf

Een iets meer contrasterende kleur hemelblauw die ook op lichtgrijze achtergronden kan worden toegepast

Rijkswaterstaat lichtgeel #fcf29a

Gebruikt als vlak op een reeds gele achtergrond

# Grijstinten

Voor tabellen, lijsten en subtiele lay-out-scheidingen worden de grijstinten van Rijkshuisstijl gebruikt. Te allen tijde wordt gezorgd voor een goede leesbaarheid en voldoende contrast.

Rijkshuisstijl grijs 1 #f3f3f3

Rijkshuisstijl grijs 2 #e6e6e6

Rijkshuisstijl grijs 3 #cccccc

Rijkshuisstijl grijs 4 #b4b4b4

Rijkshuisstijl grijs 5 #999999

Rijkshuisstijl grijs 6 #696969

Rijkshuisstijl grijs 7 #535353

# Extra grijstinten

Daarnaast worden een aantal grijstinten gebruikt die niet voorkomen in de Rijkshuisstijl. Hier is voor gekozen om meer subtiliteit te bereiken in randen, achtergronden en teksten die meer contrast nodig hebben.

Rijkswaterstaat grijs 1 #dddddd

Gebruikt in randen en achtergronden

Rijkswaterstaat grijs 2 #a9a9a9

Gebruikt in randen en achtergronden

Rijkswaterstaat grijs 3 #222222

Voor teksten

# Signaalkleuren

De signaalkleuren worden gebruikt voor melding, notificaties en statussen.

Rijkshuisstijl groen #39870c

Rijkshuisstijl geel #f9e11e

Rijkshuisstijl donkergeel #ffb612

Rijkshuisstijl orange #e17000

Rijkshuisstijl rood #d52b1e


# Uitzonderingen

# Transparantie

In schaduwen, randen of overlays worden soms een transparante waarde van zwart of wit gebruikt.

# Mouseover (hover states)

Wanneer knoppen en links worden aangewezen met de muis, worden iets donkerdere varianten gebruikt dan hun standaardkleur. De kleuren krijgen een 5–10% donkerdere tint afhankelijk van de kleur.

# Sociale media

Knoppen van sociale media gebruiken hun eigen merkkleur, maar worden deze soms voor de leesbaarheid en het contrast enigszins bijgesteld.

# Weeralarm (KNMI)

Bij het Weeralarm worden in plaats van de signaalkleuren van Rijkswaterstaat afwijkende KNMI-signaalkleuren getoond:

KNMI geel #f9e11e

KNMI oranje #ef5d12

KNMI rood #ce1f00