Skill UI

Utilizes advanced AI to generate, compare, and integrate multiple production-ready, modern, and highly customizable UI component variations. Instead of a single solution, this skill provides multiple design options (e.g., pricing tables, contact forms) with advanced styling like glassmorphism and animations, ensuring the final design is unique and visually stunning. Ideal for front-end developers and designers pushing design boundaries.

Build cinematic, 2.5D interactive websites with scroll storytelling, parallax depth, floating products, text animations, and premium scroll effects without WebGL—ideal for launches, hero sections, or any page that must feel alive.

A comprehensive guide covering best practices for video creation using Remotion within React. This resource provides domain-specific rules and detailed examples for handling complex multimedia elements, including 3D rendering (Three.js), advanced animations, audio synchronization, data charting, captioning, and scene transitions. Learn how to structure professional, high-quality videos entirely through React components.

A comprehensive skill guide for building production-grade, scroll-driven motion animations. It covers advanced techniques like parallax effects, sticky sections, horizontal scrolling, and staggered reveals using both the GSAP ScrollTrigger API and Framer Motion hooks. Ideal for implementing complex, performant animations in vanilla JavaScript, React, and Next.js.

Guides using matplotlib to craft static, animated, and interactive plots through both pyplot and object-oriented APIs, detailing styling, subplots, and export options for publication-ready scientific workflows.

This guide provides comprehensive troubleshooting for common issues encountered when converting Figma designs to code using the Anima SDK. It covers authentication failures (Figma/Anima tokens), specific node/file lookup errors, code rate limits, and output quality problems, helping developers ensure accurate and robust code generation.

This skill provides actionable strategies and code patterns to significantly reduce Anima API costs. It focuses on optimizing usage through generation caching, detecting component changes for incremental generation, and implementing smart policies to minimize unnecessary API calls. Ideal for managing large-scale design-to-code workflows and controlling API budget.

This utility generates a comprehensive JSON debug bundle for troubleshooting and support requests related to the Anima SDK. It collects vital information, including environment details, Figma API connectivity status, and verifies the Anima SDK generation capabilities. Use it when filing support tickets or debugging code generation issues.

Leverages the Anima SDK to convert visual designs from Figma into production-ready code across multiple modern frameworks (React, Vue, HTML). It supports clean TypeScript integration and Tailwind CSS styling, making it ideal for developers building automated design-to-code pipelines or rapidly prototyping complex UI components directly from design mockups.

Implements an iterative development workflow using the Anima SDK. This tool allows developers to quickly generate, compare, and preview code outputs from Figma designs across multiple frameworks (React, Vue, HTML/CSS) in a local environment. Ideal for rapid prototyping, cross-framework comparison, and refining design-to-code implementation.

This guide provides a reference architecture for automating the design-to-code workflow. It outlines the complete pipeline—from Figma design input to structured React/Vue output—detailing components like Figma API integration, code generation, and crucial post-processing steps (token mapping, normalization). Ideal for establishing scalable design systems and managing large-scale design handoffs in a professional environment.

This guide assists developers in upgrading the Anima SDK versions and managing associated API changes. It covers migrating from manual Figma plugin workflows to automated SDK-based code generation, ensuring seamless integration of the latest design system features into development projects.