Zum Inhalt
NEXBRAND

Mit dem Kunden · Kapitel 22

Gegen die CI prüfen

Eine Webseite, die seit drei Jahren gepflegt wird, weicht fast immer ab: ein Blau, das einen Hauch zu hell ist, eine Schrift, die jemand für ein Formular eingebaut hat. Die Prüfung gegen die CI findet so etwas.

Eine Seite prüfen

  1. Sammeln öffnen

    In der Kopfleiste Sammeln.

  2. Gegen die CI prüfen wählen

    Unter Was soll passieren?.

  3. Kunden wählen

    Er braucht eine veröffentlichte Fassung; gegen die geltende wird geprüft.

  4. Quellen angeben und Sammeln klicken

    Webseite, GitHub-Repo oder PDF-Styleguide, wie im Kapitel Sammeln.

Was das Ergebnis sagt

Unter „Gegen 2026 geprüft“ steht jede gefundene Farbe neben der nächsten Farbe der CI, gemessen als ΔE 2000:

UrteilAbstandheißt meist
Stimmt.unter ΔE 1alles in Ordnung
Fast richtig, ΔE … Gemeint ist wohl die Farbe der CI.unter ΔE 8ein falscher Ton im Stylesheet
Nicht in der CIdarübereine fremde Farbe; der Anteil an allen Funden steht dabei

Schriften, die in der CI nicht vorkommen, tragen „Steht nicht in der CI.“ Der Anteil hilft beim Abwägen: Eine fremde Farbe mit einem Prozent ist ein Rand, eine mit dreißig ist ein Problem.

Collect
Die Seite Collect im Modus Check against the CI, gefundene Farben neben den Farben der CI, darunter Nearly right mit ihrem ΔE
Fast richtige Töne neben den Farben der CI.

Code prüfen über die API

Dieselbe Prüfung läuft für Programme, etwa in einer Build-Pipeline, unter POST /api/v1/clients/{kunde}/audit und über MCP mit dem Werkzeug audit.

  • Farbwerte: bis 500 je Anfrage, als #RGB, #RRGGBB, ohne #, rgb() oder hsl(). Die Urteile heißen same, near (mit der gemeinten Farbe), foreign und unreadable. Namen wie red liest nexbrand nicht.
  • Ein Stylesheet: bis 500.000 Zeichen. Seine Farben kommen dazu, und jede CSS-Regel, die Schrift- und Hintergrundfarbe setzt, wird gegen verbotene Farbpaare der Regeln und gegen 4,5:1 geprüft. var() löst nexbrand über die Variablen des Stylesheets auf.
  • Ein Projekt: mit project gilt dessen Palette.

Pavo sagtIm Stylesheet sieht nexbrand nur Paare innerhalb einer CSS-Regel. Ein Grund, den ein Element von außen erbt oder eine andere Klasse setzt, bleibt unsichtbar; schau bei wichtigen Stellen selbst nach.