Figma-Design-Accessibility-Plugin
Erkennen Sie Barrierefreiheitsprobleme, bevor auch nur eine Zeile Code geschrieben wird. Wählen Sie eine Ebene in Figma aus und erhalten Sie sofort WCAG-Kontrast- und Zielgrößenprüfungen, ohne Upload und ohne API-Token.
Farbkontrast
WCAG-AA/AAA-Kontrastberechnung mit Alpha-Compositing für halbtransparente Füllungen. Sie durchläuft übergeordnete Frames, um den tatsächlichen Hintergrund zu ermitteln, mit derselben Formel wie der Web-Scanner.
Zielgröße (WCAG 2.5.8)
Markiert interaktive Elemente (Knoten mit einer Prototyp-Klick- oder -Tap-Reaktion) unter dem Mindestmaß von 24×24px.
Noch nicht im Figma-Community-Marktplatz. Das Plugin ist voll funktionsfähig, aber ein Marktplatz-Eintrag wurde noch nicht veröffentlicht. Installieren Sie es in der Zwischenzeit anhand der folgenden Schritte aus dem Quellcode.
Aus dem Quellcode installieren
- 1
Quellcode herunterladen
Klonen Sie das AccessiSight-Repository (oder laden Sie den Ordner packages/figma-plugin herunter) auf Ihren Computer.
- 2
Öffnen Sie das Plugin-Entwicklungsmenü von Figma
Gehen Sie in der Figma-Desktop-App zu Menu → Plugins → Development → Import plugin from manifest…
- 3
Manifest auswählen
Wählen Sie die Datei manifest.json im heruntergeladenen Ordner packages/figma-plugin aus.
- 4
Auf einer Auswahl ausführen
Wählen Sie beliebige Text- oder interaktive Ebene(n) in Ihrer Datei aus und führen Sie dann AccessiSight über Plugins → Development aus. Probleme erscheinen sofort, sobald Sie Ihre Auswahl ändern.
FAQ zum Figma-Plugin
Möchten Sie dieselben Prüfungen auf einer Live-Website?
Führen Sie mit der vollständigen Web-App einen kompletten Scan durch (oder crawlen Sie eine ganze Website).
Website scannen