illustrator.to.design Docs

illustrator.to.design docs

What it is

illustrator.to.design converts Adobe Illustrator (.ai) files into editable Figma designs — through a Figma plugin, a web tool, or the ‹div›RIOTS API.

Option Output
Figma plugin Figma layers, or high-res images
Web tool Figma layers via clipboard
API Figma layers, or JSON

The Figma plugin requires Figma open; the web tool and API don't. Full output details, including all API formats, in the Output section below.

What it does

Drop in an .ai file. illustrator.to.design reads its artboards and rebuilds them as native Figma layers — vector shapes and paths, text, groups, gradients, and images — keeping the layer structure and hierarchy of the original. Artboards come in as fully editable layers, or as high-res images (see Output, below).

Where it runs

The plugin runs inside Figma — you'll need Figma open to use it (Figma Community). It also works in Figma Slides: drop an .ai file into the plugin and it converts into editable Figma layers you can use in your slide deck.

The web tool runs in your browser, at divriots.com/illustrator.to.design — no Figma required. Accepts drag-drop or click-to-browse uploads.

The ‹div›RIOTS API runs wherever you call it from — any backend or app that can make an HTTP request. Same engine, exposed as the ai input format. Metered separately — see Pricing. Full reference: ‹div›RIOTS API documentation.

Supported input formats

Format Extension
Adobe Illustrator .ai

Supported across the plugin, the web tool, and the API (as the ai input). Files with multiple artboards are supported — the plugin detects every artboard in the file. For .eps and .ps files, see eps.to.design.

Output

Figma plugin

The plugin imports your artboards into Figma as fully editable layers or as high-res images. If the file has several artboards, the plugin detects them all and lets you choose which ones to import — all at once or one at a time. If a font in the file isn't available in Figma, the plugin gives you the option to map fonts to alternatives.

Web tool

The web tool returns the converted file as Figma layers only — there's no HTML output. Drop your .ai file, wait for the conversion, then copy the result to your clipboard and paste it straight into Figma.

API

Four output formats are available for the ai input type:

Output format What it is
figma-clipboard Data to load into the clipboard and paste onto the Figma canvas
figma-rest JSON, structurally compatible with the Figma REST API
figma-json Figma's JSON_REST_V1 node export
json JSON visual definition of the content (schema undocumented)

Full reference: ‹div›RIOTS API documentation.

Editability

Element Behavior
Artboards Each artboard imports as fully editable Figma layers, not a flattened image. In files with several artboards, you choose which ones to import.
Vector shapes and paths Stay fully editable — you can adjust anchor points and reshape without quality loss.
Text Comes through intact with the rest of the editable layers, with fonts carried over.
Fonts The same font needs to be installed in Figma for text to match. If it isn't, the plugin gives you the option to map fonts to alternatives.
Layers and groups Layer structure, hierarchy, and layout are kept.
Gradients, shadows, and transparency Linear gradients, transparency, and opacity masks convert reliably. Radial gradients may come through rasterized, and drop shadows arrive as rendered artwork rather than editable Figma effects.
Images Images in the Illustrator file import as high-resolution images.

This table describes the editable-layers output.

Limitations

Limitation Value
Highly specialized effects Illustrator's 3D rendering and certain artistic brush strokes may need adjustment after import.
Fonts Fonts not installed in Figma need to be mapped to an alternative.
Maximum file size 10 GB. The plugin refuses anything larger on drop, and the ‹div›RIOTS API shares the same 10 GB upload ceiling.
Very large or complex files For multi-artboard files that are very large or complex, importing the artboards in batches can improve speed.
API request size Requests sent inline are capped at ~32 MB; above 28 MB the client switches to upload-by-reference automatically. For larger files, upload first with POST /convert/upload, then convert by reference — up to the 10 GB ceiling.

Privacy & processing

Terms and privacy policies for ‹div›RIOTS products are published at divriots.com/legal.

Pricing

Option Free tier Paid
Figma plugin & web tool 5 free imports (first artboard only) Unlock more with ‹div›RIOTS ONE
API — Metered per call; the ai input is a flat 2 credits per call, whichever output format — see API pricing

One subscription for every ‹div›RIOTS product — illustrator.to.design included — with a shared credit balance you can top up as needed.

Explore plans

How to use

Figma plugin

  1. Open your Figma file — or a Figma Slides file — and launch illustrator.to.design from the plugins menu.
  2. Drag and drop your .ai file into the plugin, or use the file picker to select it.
  3. If the file has several artboards, choose the ones to import.
  4. If the file uses fonts that aren't in Figma, map them to alternatives.
  5. Click Import.
  6. Your artboards land in Figma as fully editable layers — edit directly on the canvas.

Web tool

  1. Go to divriots.com/illustrator.to.design.
  2. Drop your .ai file, or click to browse.
  3. Wait while the file is converted.
  4. Copy the result as Figma layers to paste into Figma.
  5. Paste into Figma.

API

  1. Generate an API key from your ‹div›RIOTS ONE dashboard.
  2. Send a request to the /convert endpoint with input: ai and a chosen output format — figma-clipboard, figma-rest, figma-json, or json.
  3. The conversion runs as a background job (the call returns 202 with a poll Location): poll the job URL until it's done, then download the result.

Full reference: ‹div›RIOTS API documentation.

FAQ

What file types does illustrator.to.design support?

.ai — Adobe Illustrator files, including files with multiple artboards. For .eps and .ps files, see eps.to.design.

Can I import Illustrator files with multiple artboards?

Yes — the plugin detects every artboard in the file and lets you choose which ones to import, all at once or one at a time.

Is the result editable, or a flattened image?

Editable. Artboards import as fully editable layers, not a flattened image — shapes, paths, text, and groups come through intact. The plugin can also import artboards as high-res images.

Do vector paths stay editable?

Yes — you can adjust anchor points and reshape paths without quality loss.

What happens to my fonts?

Fonts carry over, but the same font needs to be installed in Figma for text to match. If it isn’t, the plugin gives you the option to map fonts to alternatives.

Will gradients, shadows, and transparency survive the conversion?

Linear gradients, transparency, and opacity masks convert reliably. Radial gradients may come through rasterized rather than as editable gradients, and drop shadows arrive as rendered artwork rather than editable Figma effects. Highly specialized effects — such as Illustrator’s 3D rendering or certain artistic brush strokes — may need adjustment after import.

What happens to images in my Illustrator file?

They import as high-resolution images.

Does it work in Figma Slides?

Yes — run the plugin in a Figma Slides file, drop in your .ai file, and it converts into editable Figma layers you can use in your slide deck.

What file size is supported?

Files up to 10 GB — the plugin refuses anything larger on drop, and the ‹div›RIOTS API shares the same 10 GB upload ceiling. It handles most standard-sized project files comfortably; for very large or complex multi-artboard files, importing the artboards in batches can improve speed.

Can I get HTML output instead of Figma layers?

No — illustrator.to.design only produces Figma output: layers via the plugin, layers via clipboard from the web tool, or figma-clipboard, figma-rest, figma-json, or json via the API. For HTML output from an image, see image.to.design.

Can I use illustrator.to.design without Figma?

Yes — the web tool at divriots.com/illustrator.to.design runs in your browser without needing Figma open. Copy the result to your clipboard as Figma layers, then paste it into Figma when you’re ready. The ‹div›RIOTS API doesn’t need Figma either.

Is there an API for illustrator.to.design?

Yes — the ‹div›RIOTS API accepts Illustrator files as the ai input and returns Figma layers or JSON: figma-clipboard, figma-rest, figma-json, or json. See the API documentation for the full reference.

Can I import an Illustrator file that I exported as a PDF?

Yes — pdf.to.design accepts PDFs, including exports from Adobe Illustrator.

Does it work with Figma's Dev Mode?

Yes — once converted, standard Figma functionality applies, including Dev Mode inspection, prototyping, and component libraries.

Is illustrator.to.design free?

The plugin includes 5 free imports (first artboard only). It’s also included in ‹div›RIOTS ONE (see Pricing, above). The API is credit-metered per call.

See also