Raven

Provide design guidance, patterns, brand rules, and tokens for AI-generated UI.

Source

Official Registry

Updated

2026-05-04

// securityCaution

Runs locally
Official / curated
Open source
Community-trusted

Running security audit…

Credentials
Network egress
Code execution
Data access
Supply chain

// install

Copy the install command and let the AI configure it · recommended for beginners

Please install the "Raven" MCP server from askskill:
Run: claude mcp add 'ai-ravenmcp-raven-mcp' -- npx -y raven-mcp

// examples

Generate a brand-aligned interface

Prompt

Based on the following brand guidelines, generate UI design guidance for a SaaS dashboard: primary colors are navy and teal, style is modern and minimal, buttons use 8px radius, readability is critical, and include suitable component patterns and design tokens.

Expected

A set of brand-aligned UI recommendations including layout ideas, component patterns, and design tokens such as colors and typography.

Create component specs for AI-generated UI

Prompt

I am building a system that auto-generates frontend pages with AI. Summarize reusable UI patterns for login pages, form pages, and data table pages, and provide design principles for buttons, inputs, cards, and tables.

Expected

Reusable component specs and page patterns suitable for automated generation, ensuring consistent visuals and interactions.

Organize design tokens for development

Prompt

Please organize this design system into a frontend-ready design token structure covering colors, font sizes, spacing, radii, shadows, and state variables, and explain how they should be used when AI generates UI.

Expected

A structured set of design tokens with usage guidance to keep development and AI generation consistent.