Skill UI

This utility allows developers to view, add, and modify design tokens (such as colors, spacing, typography, and shadows) within the StyleSeed design system. It ensures visual consistency by managing the synchronization of changes across JSON source files and corresponding CSS custom properties, supporting both light and dark mode variations.

This specialized skill automates the process of converting visual designs (from Stitch) into high-quality, modular React and Vite components. It adheres to modern frontend best practices, enforcing logic isolation via custom hooks, data decoupling using mock data files, and ensuring type safety with TypeScript interfaces. The workflow includes automated asset fetching, style mapping (Tailwind), and rigorous validation cycles to produce production-ready, maintainable code.

This skill provides comprehensive, expert-level guidelines for authoring robust design systems. It covers foundational style tokens, strict accessibility requirements (WCAG 2.2 AA), and detailed component anatomy (states, variants, interaction behavior). Use this to create implementation-ready documentation that ensures visual consistency and optimal user experience across all digital platforms.

This skill provides comprehensive, expert guidelines for building a robust and accessible Glassmorphism design system. It offers actionable rules for engineers and designers, covering style foundations (typography, color, spacing), component anatomy, state management, and WCAG 2.2 AA accessibility requirements. Use it to ensure visual consistency, high performance, and modern elegance across all platforms.

Act as an expert guide for architecting comprehensive, implementation-ready design systems tailored for luxury brands. This skill generates structured guidelines covering style foundations, design tokens, component anatomy, state management, and rigorous accessibility criteria (WCAG). It ensures consistency, adherence to a high-end visual aesthetic, and provides actionable, code-review-ready documentation.

This expert skill guides the creation of comprehensive, highly structured, and implementation-ready design system guidelines based on Material Design principles. It ensures consistency across visual style, accessibility (WCAG 2.2 AA), and component behavior. The output is actionable documentation covering tokens, states, variants, and anti-patterns, suitable for guiding both engineers and designers.

Design, enforce, audit, and validate Power BI report themes using the pbir CLI. Centralizes formatting, promotes visual styles, and ensures theme compliance for consistent, maintainable reports.

This skill guides authors and researchers on how to strategically position their computer graphics, rendering, or visual computing work for the ACM SIGGRAPH conference. It covers core fit assessment, required evidence (visual, mathematical, or system), manuscript reframing from journal/arXiv styles, and navigating venue-specific submission requirements. Use this tool to improve your conference submission strategy and maximize visibility among top graphics reviewers.

This guide outlines the standards for creating publication-quality tables and figures for economics journals, particularly adhering to the rigorous 'REStat' house style. It ensures that the main findings are legible in a single, self-contained exhibit, emphasizing standard errors, clear notes, and load-bearing visualizations.

This skill generates high-quality, styled code screenshots by calling the ray.tinte.dev API. It allows users to convert raw code snippets into professional PNG images, supporting multiple programming languages (e.g., Python, JavaScript, TypeScript), customizable themes, and various styling parameters like font size and padding. Use this when the user explicitly requests code images, code snippets as pictures, or mentions 'ray' to visualize code.

Automates the conversion of visual designs from Stitch into high-quality, modular React and Vite components. This skill ensures strict adherence to modern architectural standards, including logic isolation via custom hooks, data decoupling, and robust type safety using TypeScript. It manages complex workflows like network fetching, style guide synchronization, and multi-phase validation to generate production-ready frontend code.

This skill enables you to view, add, or modify design tokens within the StyleSeed design system. It manages core visual properties like colors, typography, spacing, radius, and shadows by synchronizing JSON source files with CSS implementations. Use it to maintain consistency across your UI components and ensure design system integrity during development.