> ## Documentation Index
> Fetch the complete documentation index at: https://rive.app/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Flash and Animate Files

> Converting Adobe Animate and Flash files into Rive files.

export const UseCase = ({title, children}) => {
  return <aside class="callout my-4 px-5 py-4 overflow-hidden rounded-2xl flex gap-3 border border-neutral-200 bg-neutral-50 dark:border-neutral-700 dark:bg-white/10" data-callout-type="info">
      <div class="mt-0.5 w-4" data-component-part="callout-icon">
        <svg width="11" height="14" viewBox="0 0 11 14" fill="currentColor" xmlns="http://www.w3.org/2000/svg" class="text-neutral-800 dark:text-neutral-300 w-3.5 h-auto" aria-label="Tip"><path d="M3.12794 12.4232C3.12794 12.5954 3.1776 12.7634 3.27244 12.907L3.74114 13.6095C3.88471 13.8248 4.21067 14 4.46964 14H6.15606C6.41415 14 6.74017 13.825 6.88373 13.6095L7.3508 12.9073C7.43114 12.7859 7.49705 12.569 7.49705 12.4232L7.50055 11.3513H3.12521L3.12794 12.4232ZM5.31288 0C2.52414 0.00875889 0.5 2.26889 0.5 4.78826C0.5 6.00188 0.949566 7.10829 1.69119 7.95492C2.14321 8.47011 2.84901 9.54727 3.11919 10.4557C3.12005 10.4625 3.12175 10.4698 3.12261 10.4771H7.50342C7.50427 10.4698 7.50598 10.463 7.50684 10.4557C7.77688 9.54727 8.48281 8.47011 8.93484 7.95492C9.67728 7.13181 10.1258 6.02703 10.1258 4.78826C10.1258 2.15486 7.9709 0.000106649 5.31288 0ZM7.94902 7.11267C7.52078 7.60079 6.99082 8.37878 6.6077 9.18794H4.02051C3.63739 8.37878 3.10743 7.60079 2.67947 7.11294C2.11997 6.47551 1.8126 5.63599 1.8126 4.78826C1.8126 3.09829 3.12794 1.31944 5.28827 1.3126C7.2435 1.3126 8.81315 2.88226 8.81315 4.78826C8.81315 5.63599 8.50688 6.47551 7.94902 7.11267ZM4.87534 2.18767C3.66939 2.18767 2.68767 3.16939 2.68767 4.37534C2.68767 4.61719 2.88336 4.81288 3.12521 4.81288C3.36705 4.81288 3.56274 4.61599 3.56274 4.37534C3.56274 3.6515 4.1515 3.06274 4.87534 3.06274C5.11719 3.06274 5.31288 2.86727 5.31288 2.62548C5.31288 2.38369 5.11599 2.18767 4.87534 2.18767Z"></path></svg>
      </div>
      <div class="text-sm prose dark:prose-invert min-w-0 w-full [&_kbd]:bg-background-light dark:[&_kbd]:bg-background-dark [&_code]:!text-current [&_kbd]:!text-current [&_a]:!text-current [&_a]:border-current [&_strong]:!text-current text-neutral-800 dark:text-neutral-300" data-component-part="callout-content">
        <strong>Example{title && ` - ${title}`}</strong>

        {children}
      </div>
    </aside>;
};

Rive can convert Adobe Animate files into Rive files. Library symbols, timelines, tweens, buttons, frame scripts, and sounds are rebuilt as Rive content you can edit, so you can bring existing Flash animation into Rive without recreating it by hand.

Rive supports two file types:

* `.fla` files saved in Animate CC or later
* XFL folders, zipped into a single `.zip` file

## Converting a Flash file

<Steps>
  <Step>
    Open the [File Browser](/docs/editor/interface-overview/file-browser) and select the project and folder you want the file to go in.
  </Step>

  <Step>
    Drag the `.fla` or zipped XFL file into the file browser.
  </Step>
</Steps>

Rive converts the file and adds a new Rive file to the folder. The new file uses the original file's name.

<Note>
  The original `.fla` or `.zip` file isn't kept. Keep a copy if you want to make changes in Animate later.
</Note>

## How Animate content converts

The converter uses Rive features that work the same way as the original Animate features.

| Animate | Rive |
| - | - |
| Main timeline | An [Artboard](/docs/editor/fundamentals/artboards) named **Scene 1**, sized to the stage, with the stage color as its background |
| Library symbol | An artboard for each symbol, placed as [Components](/docs/editor/fundamentals/components) |
| Timeline | A [Timeline](/docs/editor/animate-mode/timeline) on each artboard, played by a [State Machine](/docs/editor/state-machine/state-machine) |
| Classic, motion, and shape tweens | Keys with [interpolation](/docs/editor/animate-mode/interpolation-easing), including custom eases and tween rotation |
| Frame-by-frame animation | Solos |
| Motion guides | [Follow Path constraints](/docs/editor/constraints/follow-path-constraint), including orient to path |
| Layer parenting | Groups nested to match the layer hierarchy |
| Mask layers | Clipping shapes |
| IK bones and poses | Bones and their animation |
| Bitmaps | Embedded image assets. Bitmap fill transforms, smoothing, and instance alpha carry over |
| 9-slice scaling | [N-Slicing](/docs/editor/layouts/n-slicing) |
| Frame sounds (MP3, WAV, FLAC) | [Audio Events](/docs/editor/events/audio-events) |
| Static, dynamic, and input text | [Text](/docs/editor/text/text-overview) |

Shapes, primitives, solid and gradient fills, dashed and dotted strokes, and guide and folder layers also carry over.

### Frame labels and scripts

Frame labels become states in the artboard's state machine. Frame scripts that call `stop()`, `gotoAndPlay()`, or `gotoAndStop()` become [transitions](/docs/editor/state-machine/transitions) between those states. Targets can be frame numbers or labels. Scripts can be ActionScript 2, ActionScript 3, or HTML5 Canvas JavaScript.

Only top-level calls convert. Calls inside functions, event handlers, or conditionals depend on information the state machine doesn't have, so they're skipped.

<UseCase title="Looping an idle section">
  Your main timeline has an `intro` label on frame 1 and an `idle` label on frame 30. A frame script on the last frame of `idle` calls `gotoAndPlay("idle")`.

  After converting, the state machine has an `intro` state followed by an `idle` state. The `idle` state transitions back to itself, so the intro plays once and the idle section loops.
</UseCase>

### Buttons

Button symbols get a state machine with **Up**, **Over**, and **Down** states. The Hit frame becomes an invisible hit area with [Listeners](/docs/editor/state-machine/listeners) that track hover and press. If the Hit frame is empty, the Up frame is used instead, as in Animate.

Hover and press are stored as `hovered` and `pressed` properties on a [View Model](/docs/editor/data-binding/view-models) named after the symbol. Each placed button gets its own instance of that view model, so each button responds on its own.

### Graphic symbols

Graphic symbols keep their playback settings: **Loop**, **Play Once**, **Single Frame**, and both reverse modes, along with first and last frame. Their playback stays synced to the parent timeline.

### Fonts

Font names carry over to text styles. Inter is embedded as the default font. If a font isn't available in Rive, [import it](/docs/editor/text/fonts) and assign it to the affected text.

## Limitations

Some Animate features don't convert:

* **Additional scenes:** Only the first scene converts. Scripts that jump to another scene are skipped.
* **Color effects, filters, and blend modes:** Tint, brightness, advanced color effects, filters, and blend modes are removed. Alpha converts to opacity.
* **ActionScript logic:** Only the frame script calls described in [Frame labels and scripts](#frame-labels-and-scripts) convert. Other code is removed.
* **Images that can't be decoded:** These are left out of the converted file.

## After converting

The converted file is a starting point. Review it and adjust as needed:

* Check that fonts look correct, and import any that are missing.
* Rebuild color effects and filters with Rive features, such as fills, opacity, or [Blend Modes](/docs/editor/fundamentals/fill-and-stroke).
* Remove artboards you don't need. To match Animate's 9-slice behavior, a symbol placed at several different scales gets a separate artboard for each scale.
* Rename states, timelines, and view models to fit your project.