Skills
.Work. You
Rest

rayden-use

Community

Design Rayden UI in Figma with token enforcement.

Design & Creative#synchronization#figma#mcp#tokens#design-system#ui-components#rayden
Authoranonymouswhite07
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Build and maintain Rayden UI components and screens directly in Figma using the Figma MCP, enforcing the Rayna UI design system with resolved design tokens, craft rules, anti-pattern detection, and visual validation to ensure consistency and quality across outputs.

Core Features & Use Cases

  • Enforces Rayna UI design tokens and craft rules in Figma to maintain visual consistency.
  • Supports three style modes (conservative, balanced, expressive) for flexible UI expression.
  • Includes a dedicated subagent for full-page screen composition (dashboards, landing pages, auth forms).
  • Syncs React component updates back to Figma to keep design and implementation aligned.
  • Performs visual validation and anti-pattern checks to ensure premium quality output.

Quick Start

Connect your Figma file to the Rayden MCP and begin building a new Rayden UI component with tokens enforced.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: rayden-use
Download link: https://github.com/anonymouswhite07/Portfolio-v1/archive/main.zip#rayden-use

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.