Kontrastprüfung

Prüfen Sie das WCAG-Kontrastverhältnis zwischen Vordergrund- und Hintergrundfarbe.

Das Tool berechnet die relative Luminanz beider Hex-Farben, gibt das Kontrastverhältnis aus und kennzeichnet, ob das Paar die AA- und AAA-Schwellen für normalen und großen Text erfüllt.

Schwellenwerte

• AA normaler Text: 4,5:1
• AA großer Text: 3:1
• AAA normaler Text: 7:1
• AAA großer Text: 4,5:1

Die Berechnung läuft ausschließlich im Browser und eignet sich für Designprüfungen sowie Barrierefreiheits-Reviews.

Wann Sie es nutzen

Wählen Sie Text- und Hintergrundfarben während des UI-Designs, prüfen Sie Button-Beschriftungen auf getönten Headern und dokumentieren Sie Kontrastentscheidungen vor der Übergabe an die Entwicklung. Ungültige Hex-Werte liefern einen klaren Fehler statt eines irreführenden Verhältnisses.

Einschränkungen

Die Ergebnisse hängen von Ihren Eingaben und der Browser-Arithmetik ab; sie sind nicht für regulatorische Konformität auditiert. Sehr große Eingaben, lokalabhängige Rundung oder Randfälle können von Tabellenkalkulationen oder Server-Implementierungen abweichen.

Beispiel

Geben Sie die Standard-Beispielwerte im Formular ein und vergleichen Sie die Ausgabe mit einer bekannten Referenz; ändern Sie jeweils nur einen Wert, um die Auswirkung zu sehen.

Dieser Skill ist über A2A JSON-RPC und REST verfügbar. Wenn Sie Skill-ID und Export kennen, rufen Sie execute direkt auf—ohne Discovery.

REST-Beispiel

curl -sS -X POST https://toolplaza.app/api/helpers/execute \
  -H 'Content-Type: application/json' \
  -d '{"skillId":"colors__contrast-checker","export":"calculateContrastRatio","args":["#000000","#ffffff"]}'

A2A JSON-RPC-Beispiel

Send POST https://toolplaza.app/api/a2a with:

{
  "jsonrpc": "2.0",
  "id": "1",
  "method": "message/send",
  "params": {
    "message": {
      "messageId": "uuid",
      "role": "user",
      "parts": [
        {
          "kind": "text",
          "text": "ignored"
        }
      ]
    },
    "metadata": {
      "toolplaza": {
        "skillId": "colors__contrast-checker",
        "export": "calculateContrastRatio",
        "args": [
          "#000000",
          "#ffffff"
        ]
      }
    }
  }
}

Vollständige Agenten-API-Anleitung · Skill-Schema