Skill UI

Execute a comprehensive creative workflow utilizing the Adobe Firefly v3 API. This tool supports advanced AI image generation from text prompts (text-to-image), generative fill for inpainting masked areas, and image expansion (outpainting) to grow canvas size. Ideal for automating marketing asset creation and building complex creative pipelines.

Automate the complex process of migrating design systems, design tokens, and styles between multiple Figma files, or from external sources into Figma. This tool covers the full pipeline: inventorying assets, extracting raw style data (colors, typography, effects), transforming them into structured design tokens (e.g., JSON format), and finally writing them back into Figma variables using the Variables API. Ideal for maintaining consistency across large design libraries.

Generate professional, master-level designs in the unique Mondo aesthetic. This skill is perfect for creating stunning posters, book covers, album art, and event promotion materials for various platforms (e.g., 9:16, 1:1, 21:9). It removes the need for graphic design expertise by automatically optimizing prompts, simulating limited color palettes (screen print), and applying advanced compositional techniques like negative space storytelling and dramatic scale contrast.

Wraps any existing HTML artifact (landing page, dashboard, etc.) with a live sidebar panel of controls. This panel allows users to instantly adjust design variables—such as accent color, typography scale, layout density, and dark mode—by rewriting CSS custom properties in real time. All changes are persisted via localStorage, enabling continuous exploration and variant testing without losing state.

A general-purpose tool for creating self-contained, professional web prototypes. Ideal for generating landing pages, marketing sites, or documentation mockups. It operates by assembling pre-engineered sections and adhering strictly to a defined design system, eliminating the need for custom CSS writing.

A comprehensive, expert-level guideline for building Agentic User Interfaces (UIs). This system emphasizes conversational interactions, clear outcomes, and minimal user controls, allowing users to delegate complex tasks to AI. It provides structured rules covering color tokens, typography, accessibility (WCAG 2.2 AA), and component anatomy for professional developers and designers.

An expert guide for creating comprehensive, implementation-ready design systems based on an expressive, high-contrast artistic style. It covers design tokens, component anatomy, advanced accessibility standards (WCAG 2.2 AA), and structured content guidelines for engineers and designers.

This skill serves as an expert design-system guideline author, providing comprehensive, implementation-ready guidance for the Bento grid layout. It defines design tokens (color, spacing, typography), component anatomy, state management, and strict accessibility standards (WCAG 2.2 AA). Use this to create highly structured, scalable, and consistent UI/UX documentation for engineers and designers.

This skill provides comprehensive, production-ready guidelines for building a consistent design system. It covers the brand's authoritative, research-journal aesthetic, defining typography, color tokens, component anatomy, and mandatory accessibility criteria (WCAG 2.2 AA). It ensures all UI elements adhere to technical and aesthetic standards.

This comprehensive guide provides expert-level, implementation-ready guidelines for developing a cohesive Claymorphism UI. It defines foundational design tokens (color, typography, spacing), establishes component anatomy and states, and mandates adherence to WCAG 2.2 AA accessibility standards. Use this resource to ensure consistency and quality across all digital products adopting the soft, puffy, 3D-like clay aesthetic.

This skill guides the creation of comprehensive, implementation-ready design system guidelines based on contemporary, minimalist, and high-performance principles. It teaches authors to structure documentation covering design tokens, component anatomy, interaction states, and crucially, adhering to WCAG 2.2 AA accessibility standards, ensuring consistency and usability for both designers and engineers.

Provides expert guidance for building professional, scalable, and brand-aligned design systems. It covers foundational tokens (color, typography, spacing), component anatomy, accessibility standards (WCAG 2.2 AA), and structured content writing rules, ensuring design consistency and high quality for large-scale enterprise products.