What is the difference between Path A and Path B in Anima?

Path A (Create & Publish) is for building and hosting a new application from scratch, while Path B (Integrate) is for generating code to add to an existing local codebase.

How do I handle timeouts when using Anima tools?

Because full-stack generation takes time, you should always use a 10-minute (600,000ms) timeout for 'playground-create' and 'playground-publish' operations.

Does Anima require a Figma account?

A Figma account is only necessary if you are using the Figma-to-code (f2c) workflow to import specific design files or nodes.

Do I need an API key to use this skill?

Yes, for headless environments and CLI usage, an ANIMA_API_KEY is required to authenticate with the Anima platform.

What tech stacks does Anima support?

Anima supports React with styling options including Tailwind CSS, CSS Modules, and UI libraries like Shadcn, MUI, and Ant Design.

Anima Design & Build

Name: Anima Design & Build
Author: AnimaApp

byAnimaApp

•

デザインツール

Transforms prompts, Figma designs, and website URLs into production-ready, full-stack applications with built-in hosting and databases.

Anima acts as a design-intelligent agent in your AI coding workflow, enabling the seamless conversion of visual ideas into functional software. It offers two primary paths: building entire full-stack applications from scratch—complete with databases and hosting—or integrating design-accurate components directly into existing codebases. By supporting prompt-to-code, website cloning, and Figma-to-code workflows, Anima ensures brand consistency and high-quality frontend implementation while automating infrastructure setup, allowing developers to focus on core logic rather than styling minutiae.

主な機能

01Built-in Infrastructure: Automated hosting and scalable database provisioning for every project.

02Figma Integration: Direct implementation of Figma designs into production-ready React components.

031 GitHub stars

04Prompt-to-Code: Generate full-stack web applications from natural language descriptions.

05Parallel Variant Creation: Generate and compare multiple design directions simultaneously using AI.

06Website Cloning: Recreate any live website as an editable playground and codebase.

ユースケース

01Converting complex Figma design systems into clean Tailwind CSS and React code for an existing repo.

02Rapidly prototyping a new SaaS dashboard by describing features and aesthetic preferences.

03Cloning and modifying reference websites to quickly launch proof-of-concept landing pages.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add animaapp/mcp-server-guide anima

For use in Claude.ai and ChatGPT

Download Skill