All Skills

Frontend design guidance, upstream-maintained (impeccable).

54 real design systems (Stripe, Linear, Vercel) as HTML/CSS.

Author/validate/export Google's DESIGN.md token spec files.

Throwaway HTML mockups: 2-3 design variants to compare.

Design one-off HTML artifacts (landing, deck, prototype).

Stop coding agents from shipping generic UI. Extend the product's design system, use UIZZE evidence only when useful, cover required states, and inspect the rendered result.

Routes frontend design tasks to 48 specific UI styles. Triggers for websites, app screens, or UI components requesting a specific aesthetic.

Evaluate interfaces against 168 research-backed UX/UI principles, detect antipatterns, and inject UX context into AI coding sessions.

Score a rendered web or iOS screen for generic UI risk before it ships. Use when a user asks whether a UI looks generic or needs an honest pre-merge visual review.

Build and maintain Rayden UI components and screens in Figma via Figma MCP with full design token enforcement

Generate React code with Rayden UI components using correct props, tokens, and premium layout patterns

Builds two parameterized UI modes—流光溢彩白 (iridescent white) and 五彩斑斓黑 (colorful black)—with OKLCH, WebGL/CSS fallback, vision gating, screenshot QA, and total/per-color intensity reports. Use when a UI request names either mode or needs measured color parameters.

Use when generating Google Stitch DESIGN.md systems for premium typography, color, layout, motion intent, and anti-generic UI rules.

Use when upgrading existing websites or apps by auditing generic UI patterns and applying premium design fixes without rewrites.

Use when creating clean editorial interfaces with warm monochrome palettes, crisp borders, restrained motion, and flat bento layouts.

Use when creating raw industrial or tactical telemetry UIs with rigid grids, stark typography, CRT effects, and high-density data.

Use when designing expensive agency-grade interfaces with premium fonts, spatial rhythm, soft depth, and fluid microinteractions.

Use when designing or reviewing polished product UI with Emil Kowalski-inspired animation, interaction, and component craft guidance.

Use when building high-agency frontend interfaces with strict design taste, calibrated color, responsive layout, and motion rules.

Set up Avalonia UI project with cross-platform XAML for Windows, macOS, and Linux

Generate QML components with proper property bindings, signal/slot connections, and Qt Quick Controls integration

Build native OS notifications with actions, images, and progress indicators across platforms

Configure Flutter for desktop platforms with platform channels and native integrations

Generate XAML styles, templates, and resource dictionaries with theme support for WPF applications