Skill UI

A comprehensive guide detailing best practices for creating modern, clean, and highly maintainable user interfaces using Avalonia and Zafiro.Avalonia. It emphasizes leveraging semantic containers, defining shared styles, and utilizing generic components to dramatically reduce XAML redundancy and improve code structure. Learn to adopt patterns like Behaviors over Converters, and prevent deep nesting for optimal developer experience.

This comprehensive skill uses industry-standard tools like Prettier to automatically format and validate code files across multiple languages (JavaScript, TypeScript, JSON, CSS, Markdown, etc.). It ensures code style consistency, improves readability, and helps maintain a clean, professional codebase. Use it when needing to "format my code," "check formatting," or enforce code style across a project.

This advanced system transforms session interactions into reusable, atomic knowledge units called "Instincts." By hooking into tool usage and session activity, it observes patterns (like preferred coding styles, error fixes, or repeated workflows). These instincts are then clustered and "evolved" into structured Skills, Commands, or specialized Agents, capturing deep contextual knowledge with weighted confidence scoring to enhance development productivity.

A comprehensive guide to utilizing a core, token-driven component library and design system patterns. It details best practices for managing UI styles—including spacing, color, and typography—by using semantic design tokens instead of hard-coded values. Ideal for building consistent, scalable, and maintainable user interfaces across different platforms.

This expert specializes in scaffolding complete, production-ready, accessible, and performant React and React Native components. It generates full boilerplate code including TypeScript definitions, unit tests, styles (CSS Modules, Styled-Components, Tailwind), and accessibility hooks, ensuring adherence to modern best practices for scalable frontend architecture.

A modern, dark-themed UI component library built with React, Tailwind CSS, and Framer Motion. It provides a comprehensive set of components and styles ideal for developing professional dashboards, admin panels, and data-rich applications. Features include advanced glassmorphism effects and tasteful, smooth animations to enhance user experience.

Guidance for building robust GraphQL services: schema design with Relay-style pagination, resolver patterns that leverage per-request DataLoader for N+1 prevention, subscription handling, and structured error payloads to simplify client integrations.

A comprehensive skill designed to manage, track, and persist image assets generated by Ideogram's API. This tool addresses the critical issue of expiring image URLs by implementing a complete lifecycle pipeline. It handles metadata tracking (prompt, seed, model, style, etc.), immediate downloading, and robust storage to both local filesystems and cloud solutions like S3. Features include asset persistence, generation history logging, and image reproduction using stored seed values.

This guide outlines the process of migrating codebase dependencies and logic when upgrading the Ideogram API from legacy versions (V1/V2) to the robust V3 endpoints. It addresses critical breaking changes, including the shift from JSON body to multipart/form-data, changes in model naming, aspect ratio syntax, and the integration of new V3 features like rendering speed and style presets. Provides structured code adapters for smooth transition.

A mandatory workflow for ensuring high code quality across multiple ecosystems, including Node.js/TypeScript and Python. This pipeline runs static analysis tools—such as linters, type checkers (MyPy, tsc), and security scanners (Bandit)—after every code change. It mandates that no task is considered 'done' or committed until all validation checks pass, resolving style, syntax, and type mismatches.

Documenting React Native and Flutter patterns for building responsive, performant product lists with typed navigation, safe areas, and platform-aware styles, plus anti-patterns and checklist to keep JS threads smooth.

Automates styled components helper tasks within frontend development, activating on related mentions to offer guidance, best practices, production-ready code, and validation tailored for React, Vue, and modern CSS workflows.