SecondSight

System Design
Agentic Workflow Diagram

💡 Inspiration

The web is meant to be universal, yet in 2025, 94.8% of the top one million homepages still have detectable WCAG 2 failures. For the 1.3 billion people worldwide living with a disability, these aren't just "bugs"—they are digital walls.

Today, achieving accessibility (a11y) is a slow, manual, and prohibitively expensive process. Expert audits cost between $5,000 and $50,000 per engagement, pushing compliance into "quarterly project" territory rather than a standard part of the dev cycle.

We built SecondSight to change that. We asked ourselves: What if accessibility wasn't a consulting engagement, but a linter that fixes itself?

🛠️ What it does

SecondSight is an autonomous agentic workflow that doesn't just find accessibility errors—it cures them at the source. It lives in your CI/CD pipeline and acts as a tireless a11y engineer:

Audits: It uses Playwright and axe-core to navigate your live production site, identifying violations (low contrast, missing ARIA, unlabeled inputs) in the real-world DOM.
Maps: Using a multi-strategy semantic mapper, it traces a broken HTML element on the screen back to the specific React/Next.js component in your repository.
Fixes: It leverages Gemini 3 Pro’s High Thinking mode to reason about the fix. It doesn't just guess; it analyzes your Tailwind config and component logic to generate a surgical, standards-aware patch.
Delivers: It automatically opens a GitHub Pull Request with the fix, complete with a detailed explanation of the WCAG violation it solved.

🏗️ How we built it

We used LangGraph to orchestrate a sophisticated state machine that treats code remediation as a multi-step reasoning task:

The Mapper Node: Powered by Gemini 3 Flash, this node performs high-speed semantic analysis to bridge the gap between "Live DOM" and "Source Code," identifying the exact file and line number.
The Coder Node: Leverages Gemini 3 Pro (Preview). By utilizing its Thinking capabilities, the model reasons through complex styling constraints (like dynamic Tailwind classes) to ensure the fix doesn't break the UI layout.
The Verifier Node: A specialized node that runs static analysis and a secondary LLM "Senior Dev" pass to ensure the generated code is type-safe and creates no regressions.
The Dashboard: A Next.js frontend that uses Server-Sent Events (SSE) to stream the agent's internal "thought process" in real-time, visualizing the graph execution as it works through a codebase.

📉 Challenges we ran into

The "Mapping Problem": Modern web apps are layers of abstraction deep—mapping a rendered <div> back to a specific line in a .tsx file is notoriously difficult. We solved this by creating a "Chain-of-Trace" logic where Gemini analyzes both the DOM context and the repository’s file structure to find the most probable source component with incredible accuracy.
Fighting "Over-fixing": Early iterations would rewrite entire components just to add one aria-label. We tuned the Gemini 3 Thinking Config with specific system prompts to prioritize minimal-diff patches, ensuring our PRs are clean and easily reviewable.

🏆 Accomplishments that we're proud of

We’ve successfully automated a workflow that typically takes a human engineer hours of manual "Inspect Element" work. Seeing SecondSight find a violation on a live site and produce a mergeable, valid GitHub PR in under 120 seconds feels like witnessing the future of software maintenance.

🎓 What we learned

Gemini 3 Pro's reasoning is the "Special Sauce." Previous models could identify errors, but they lacked the "consultant mindset." With Gemini 3, the agent can explain why a specific attribute is necessary for a screen reader, effectively teaching the developer while it fixes the code. It’s not just a bot; it’s an accessibility expert.

🚀 What's next for SecondSight

Visual Regression Testing: Using Gemini’s multi-modal capabilities to compare screenshots of the "before" and "after" to guarantee 0% UI breakage. Framework Expansion: Moving beyond React to support Vue, Svelte, and raw HTML. Native GitHub Action: A plug-and-play marketplace action so any repo can become accessible with one click.