How to Add Gif to Procreate
StyleFrame Team8 min read
Procreate has no way to import an animated GIF as a playing animation. Insert one and you get a static image. To work with a GIF in Procreate, split it into individual frames, bring those frames in as layers (one layer per frame) with Animation Assist turned on, then export again as a GIF, MP4, or PNG sequence. If you only need the GIF as a visual reference, insert a single frame, or keep the GIF open in another app in Split View.
Why Procreate won't import a GIF as an animation
Procreate's animation model is layer-based. With Animation Assist on, each layer or group becomes one frame on the timeline, so the app expects frames as discrete pixel layers, not a single file that carries its own timing. A GIF is a bundled sequence with per-frame delays and a 256-color palette. Procreate reads it as an image, not a clip.
That shapes the workflow. Before importing anything, decide whether you need:
- Editable frames to paint over, clean up, or restyle (rebuild the GIF as layers).
- A reference to trace or match timing against (insert one frame or view it alongside).
- A final export to share (Procreate can export animated GIF, PNG, and MP4 from its Share menu).
Method 1: Split the GIF into frames and import them as layers
This is the most reliable route, and it works for any GIF.
Step 1: Extract the frames
Turn the GIF into a numbered image sequence. Options:
- Online or desktop GIF splitters (ezgif.com is a common choice) export each frame as PNG.
- Photoshop: open the GIF, and its frames load into the timeline and layers; export layers to files.
- After Effects: import the GIF, drop it in a comp, and render a PNG sequence through the Render Queue or Adobe Media Encoder.
Check how many frames you end up with. Long GIFs produce hundreds of frames, and Procreate's layer limit depends on canvas size and your iPad's memory. Trim before you import.
Step 2: Create a canvas that matches the source
Make a new canvas at the GIF's pixel dimensions, or at a deliberate upscale. Matching the aspect ratio now avoids rescaling every frame later. A larger canvas means fewer available layers, so there's a trade-off between resolution and frame count.
Step 3: Turn on Animation Assist
Tap the wrench (Actions), go to the Canvas tab, and toggle on Animation Assist. The timeline appears at the bottom of the screen.
Step 4: Insert each frame
Go to Actions > Add > Insert a photo (or Insert a file if the frames live in the Files app). Each insert lands as a new layer above the selected one, so add frames in order, first to last. Scale each frame to fit the canvas as you go.
Tedious? Yes. For longer sequences, the layered PSD route below is faster.
Step 5: Set timing
Open the Animation Assist settings and set the frame rate to match your source. GIF timing is stored per frame in hundredths of a second, so a GIF that looks like 12 fps may carry slightly uneven delays. If you need exact timing, set the frame rate first and use Hold Duration on individual frames to correct the irregular ones.
Method 2: Build a layered PSD and open it in Procreate
If you have access to Photoshop (or any tool that writes layered PSDs), you can skip manual inserts:
- Open the GIF or video in Photoshop. For video, use File > Import > Video Frames to Layers.
- Confirm that each frame sits on its own layer, in the right order.
- Save as PSD at a resolution Procreate can handle.
- Move the PSD to your iPad (AirDrop, iCloud Drive, or a cloud folder) and open it in Procreate.
- Toggle on Animation Assist. The layers become your frames.
Procreate preserves PSD layers on import, so this gets you from GIF to editable frames in a few steps. Check for hidden layers, odd blend modes, or layer groups that might collapse frames together. Procreate's layer count limit also applies here, so a long clip may import only partially or refuse to open at its original resolution. Downscale or trim if that happens.
Method 3: Use the GIF as a reference only
Sometimes you don't need the GIF's frames at all. You want to match its motion, trace key poses, or study timing. Better options:
- Insert one or two key frames as a reference layer and lower its opacity. Put it in a group and hide it for export.
- Use the Reference companion (Actions > Canvas > Reference) to keep an image visible beside your canvas without it counting as a layer.
- Split View: run a browser, Files, or video player beside Procreate and scrub the GIF while you draw.
For a rotoscoping-style process, extract the frames, insert them as locked, low-opacity reference layers, and draw on new layers above them. Each reference layer and its drawing layer need to appear together on the same frame, so use groups, with the reference and drawing inside each group. Animation Assist treats each group as one frame.
Method 4: Convert to video and use a timeline
Procreate Dreams is Procreate's separate timeline-based animation app. If your GIF is long, convert it to MP4 first (any GIF-to-video converter, or After Effects) and check what your installed version of Dreams accepts. Video is generally a safer interchange format than GIF because it avoids the palette limits and rough transparency.
Prepping GIFs and frames from After Effects
If the GIF came out of your own comp, don't use the GIF as your source. Go back to the project.
- Render PNG sequences with alpha instead of exporting a GIF and splitting it. GIF transparency is 1-bit, so edges come out jagged. A PNG sequence keeps soft edges and full color.
- Render at your target frame rate so frame counts stay predictable. Fewer, well-chosen frames are easier to manage on iPad than every frame of a 24 or 30 fps comp.
- Name files with zero-padded numbers (
frame_0001.png) so they sort correctly in Files. - Trim to the loop. Cut the sequence to the exact loop length and avoid duplicate first and last frames, which show up as a hitch.
- Keep a flattened background separate if only the foreground needs hand-painting. In Procreate, mark the background layer with the Background toggle so it persists through the animation.
Where Styleframe fits in this workflow
Procreate is excellent for hand-drawn frame work, but producing the frames is often the slow part. Styleframe is an AI video and motion tool built for professional artistic control, and it can feed this pipeline from the front end.
Say you have a rough motion test, a GIF, or a handful of keyframes and want a stylized sequence to paint over. In Styleframe, generation is driven by your own reference images, video clips, and keyframes, not a single prompt:
- Frames-to-Video builds motion between keyframes you define, so you decide the key poses and Procreate becomes the place for cleanup and hand-finishing.
- Restyle and Ink-and-Paint apply a reference-driven look to existing footage or frames, which can give you a consistent line or paint base to refine by hand.
- Remove Background isolates a subject so you're not masking each frame manually before import.
- 4K Upscale brings the result up to production resolution; you can scale back down for iPad-friendly canvas sizes.
You can bring the frames you export from Styleframe into the Procreate steps above. A practical loop is: generate or restyle in Styleframe, export PNGs, pull the selected frames into Procreate for hand-drawn accents, then bring the finished frames back into After Effects for the final comp.
It's a complement, not a replacement. Procreate's brush feel and Animation Assist remain the right tools for the hand-drawn parts.
Exporting your animation from Procreate
When you're done, go to Actions > Share and choose:
- Animated GIF for quick sharing. Expect palette limits and rougher gradients.
- Animated PNG for better color and transparency, where the destination supports it.
- Animated MP4 or HEVC for smoother playback and smaller files when you don't need a GIF specifically.
- PNG sequence (via the image export options) when the work is going back into After Effects, Premiere Pro, or Nuke. Export frames as individual files, then import them as a sequence.
Pick a format by destination. Social and web can use MP4. Chat tools, forums, and Notion-style embeds usually need GIF. Anything headed into a pipeline should go out as a sequence.
Common problems and quick fixes
The GIF imports as a single still. Expected. Split it into frames first.
Frames play in the wrong order. Check layer stacking. Procreate plays from the bottom layer up, so the first frame must be lowest.
Everything flashes or only one element appears. You probably need to mark a layer as Background (static across the animation) or group the foreground and background layers per frame.
Edges look jagged or have halos. The GIF's 1-bit transparency is the cause. Go back to the original source and export PNGs with alpha.
You hit a layer limit. Reduce canvas size, trim the clip, or lower the frame rate. Alternatively, work in segments and join them afterward in After Effects.
Timing feels off after export. Re-check the frame rate and any per-frame hold durations. GIFs with uneven delays need manual adjustment.
FAQ
Can Procreate play an imported GIF? No. It brings in a static image. Rebuild the animation from frames.
Can I add a GIF to a Procreate canvas as a sticker or overlay? Not as an animated element. You can add one frame as a layer, or add the whole sequence as frames.
What's the best format to import? PNG sequences or a layered PSD, in that order of reliability for editing, since both preserve quality and alpha better than GIF.
Is there a faster way for long clips? The PSD route, with the clip trimmed and downsized before import.