Anima API

👉 To get access, contact us

👉 For more details, visit the Anima SDK GitHub README.

Main Features

1. Figma to Code
   Generate high-quality code from Figma files using Anima’s codegen engine.
2. Link to Code (URL → Code)
   Clone any public website with HTML or React code.

⚙️ Settings Reference

To get access, contact us

For more details, visit the Anima SDK GitHub README.

--

<h1>🛠️ Anima SDK API Reference</h1>

<p>Anima SDK allows backend programs to generate clean, production-ready code from:</p> <ul> <li><strong>Figma designs</strong></li> <li><strong>Website URLs</strong> (Early Preview)</li> </ul>

<h2>📦 Installation</h2> <pre><code>npm install @animaapp/anima-sdk # or yarn add @animaapp/anima-sdk</code></pre>

<h2>⚙️ Initialization</h2> <pre><code>import { Anima } from "@animaapp/anima-sdk";

const anima = new Anima({ auth: { token: "YOUR_ANIMA_TOKEN", userId: "optional-external-user-id" }, });</code></pre>

<h2>🔧 API Methods</h2>

<h3>1. <code>generateCode(options)</code></h3> <p>Generates code from a Figma file.</p> <pre><code>const { files, assets } = await anima.generateCode({ fileKey: "FIGMA_FILE_KEY", figmaToken: "YOUR_FIGMA_TOKEN", nodesId: ["1:2"], settings:

{ /* see below */ }, tracking: { externalId: "override-id" }, assetsStorage: { strategy: "host" | "external" } });</code></pre>

<h4>Options:</h4> <ul> <li><code>fileKey</code> (string)</li> <li><code>figmaToken</code> (string)</li> <li><code>nodesId</code> (string[])</li> <li><code>settings</code>: <ul> <li><code>language</code>: "typescript" | "javascript"</li> <li><code>framework</code>: "react" | "html"</li> <li><code>styling</code>: "plain_css", "css_modules", "styled_components", "tailwind", "sass", "scss", "inline_styles"</li> <li><code>uiLibrary</code>: "mui", "antd", "radix", "shadcn"</li> <li>Other flags: <code>enableTranslation</code>, <code>enableAutoSplit</code>, <code>disableMarkedForExport</code>, etc.</li> </ul> </li> <li><code>tracking</code>: <code>{ externalId: string }</code></li> <li><code>assetsStorage</code>: <ul> <li><code>strategy: "host"</code> – default</li> <li><code>strategy: "external"</code> – user-hosted assets</li> </ul> </li> </ul>

<h3>2. <code>generateCodeFromWebsite(options)</code></h3> <p>Generates code from a live website URL.</p> <pre><code>const { files, assets } = await anima.generateCodeFromWebsite({ url: "https://example.com", settings: { framework: "react", language: "typescript", styling: "tailwind", }, tracking: { externalId: "x" }, assetsStorage: { strategy: "host" | "external" } });</code></pre>

<h4>Options:</h4> <ul> <li><code>url</code> (string)</li> <li><code>settings</code>: same as above, but only supports: <ul> <li><code>language: "typescript"</code></li> <li><code>styling: "tailwind"</code></li> <li><code>uiLibrary: "shadcn"</code></li> </ul> </li> </ul>

<h2>⚙️ Utility Helpers</h2> <ul> <li><strong><code>isValidFigmaUrl(url: string): boolean</code></strong><br> Checks whether a given URL points to a valid Figma design. </li> </ul>

<h2>🧩 Integrations</h2> <p>For React frontend, check <code>@animaapp/anima-sdk-react</code>:</p> <ul> <li><code>useFigmaFile()</code> – fetch metadata and tree</li> <li><code>useAnimaCodegen()</code> – for local asset embedding</li> </ul>

<h2>🚀 Example</h2> <pre><code>import { Anima } from "@animaapp/anima-sdk";

async function run() { const anima = new Anima({ auth: { token: process.env.ANIMA_TOKEN } }); const { files, assets } = await anima.generateCode({ fileKey: "abc123", figmaToken: process.env.FIGMA_TOKEN, nodesId: ["0:1"], settings: { language: "typescript", framework: "react", styling: "tailwind", uiLibrary: "shadcn", }, tracking: { externalId: "user-42" }, assetsStorage: { strategy: "external", url: "https://cdn.myapp.com" } }); }</code></pre>

<h2>✅ Summary Table</h2> <table> <thead> <tr> <th>Method</th> <th>Source</th> <th>Key Options</th> <th>Assets Handling</th> </tr> </thead> <tbody> <tr> <td><code>generateCode</code></td> <td>Figma</td> <td>styling, uiLibrary, split flags</td> <td>host / external</td> </tr> <tr> <td><code>generateCodeFromWebsite</code></td> <td>URL</td> <td>tailwind, shadcn</td> <td>host / external</td> </tr> <tr> <td><code>isValidFigmaUrl()</code></td> <td>Utility</td> <td>Figma URL check</td> <td>—</td> </tr> </tbody> </table>