skills.rest
razorpay
razorpayOFFICIAL
Explore all skills by this author →
Website𝕏@razorpayGitHub

blade-compliance-reviewer

Detect Blade design-system drift in a UI file and emit a per-line Markdown report.

2|2|Updated May 13, 2026
Search Tags:#code review#linting#accessibility#design-system#markdown report#blade#ui compliance
One-click install
npx skills add https://github.com/razorpay/ai-playbook --skill blade-compliance-reviewer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: blade-compliance-reviewer
Source: https://github.com/razorpay/ai-playbook/tree/main/skills/blade-compliance-reviewer
Command: npx skills add https://github.com/razorpay/ai-playbook --skill blade-compliance-reviewer

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It pinpoints design-system drift inside a single UI file so reviewers and builders can quickly locate exactly where Blade compliance breaks.

Core Features & Use Cases

  • Per-file, per-line drift reporting: Produces a reviewer-readable Markdown report with line numbers and drift type for raw token usage, ad-hoc primitive-shaped components, reinvention of patterns, missing variants, and accessibility-attribute drift.
  • Blade-version-aware scanning: References the pinned Blade version from the loaded connector and flags only against what exists in that version.
  • Review and self-review workflow fit: Complements PR-level drift detection (like pre-ship-check) by focusing on one file for targeted correction decisions.

Quick Start

Run the skill with your target UI file so it returns a line-by-line Blade compliance report with suggested (non-code) fixes referencing real tokens, primitives, or variants.

Frequently Asked Questions about blade-compliance-reviewer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check a single UI file for Blade design-system drift?▼

To check a single UI file for Blade design-system drift, run a targeted code review that scans for raw spacing literals, ad-hoc components, missing variants, and accessibility omissions. This produces a per-line Markdown report pinpointing exact violations.

What is design-system drift and how do I detect it in my code?▼

Design-system drift occurs when UI code uses raw spacing or color literals instead of design tokens. You detect it by scanning a specific UI file deterministically against a pinned Blade version to flag reinvented patterns, missing variants, and accessibility attribute omissions.

Does Blade compliance review automatically fix raw token usage in my code?▼

Blade compliance review does not auto-fix the source code. It emits a canonical per-line Markdown report with suggested non-code fixes that reference real Blade tokens, primitives, or variants for targeted manual correction.

Can I use this approach to scan an entire pull request for design-system violations?▼

You should not use per-file Blade compliance scanning for an entire pull request. It is designed for targeted code review and self-review of a specific UI-shaped file suspected of violating Razorpay Blade rules, complementing broader PR-level drift detection.

What do I need to validate a UI file before scanning for Blade compliance?▼

To validate a UI file for Blade compliance, you need the Blade connector loaded to reference the pinned Blade version. The tool validates that the input is a UI-shaped file and scans deterministically against only what exists in that specific version.

Related Skills

Explore More Design & Creative Skills→
SocketDevSocketDev
125

fleet-updating-lockstep

Automates per-row lockstep.json drift resolution, bumping, validation, and commit via pnpm and git.

Official
Advanced
saranskumarsaranskumar

design-system-enforcer

Audit design tokens, spacing, typography, colors, and component variants for consistency.

Community
Intermediate
Chris-MaskeyChris-Maskey

caveman-review

Compress pull request review findings into one-line comments with location, problem, and fix.

Community
Intermediate
razorpayrazorpay
2

production-compiler

Compiles raw project code and SPR meta-files into structured outputs.

Official
Advanced