saiffmirza/kiyas

What it does

Kiyas is an MCP (Model Context Protocol) server that enables AI agents to perform design fidelity checks. It compares Figma design frames (or design screenshots) against actual rendered implementations, analyzing the differences and providing structured feedback about CSS properties, layout discrepancies, and severity ratings.

The tool resolves natural language component descriptions into specific URLs and CSS selectors within your codebase, allowing AI agents to understand exactly which elements need attention and what CSS properties are causing visual mismatches.

How to set up

As an MCP server, Kiyas is installed through your MCP-compatible AI assistant or development environment. Clone or install the saiffmirza/kiyas repository, configure it with your project's codebase and design system (Figma access), and connect it to your MCP client. Refer to the GitHub repository for detailed configuration and authentication requirements.

Key features

• Automated design vs. implementation comparison
• CSS property-level discrepancy detection
• Severity classification for design violations
• Natural language to code selector resolution
• Structured output format for AI agent processing
• Support for Figma frames and screenshot inputs