Features

What AE2CSS turns into web code — and what's next.

What exports today, what's partial, what's coming — and exactly where any JavaScript shows up, and where it doesn't.

Support matrix

Everything in your comp, accounted for.

Better to know the edges up front than hit them mid-project.

Supported exports today Partial works, with a stated limit Incoming on the roadmap

Motion & timing

Expression-driven motion	Supported	Wiggle, loops, time-driven spin — the expression is evaluated and rewritten as clean CSS keys. No parsing, no per-frame JavaScript.
Position, Scale, Rotation, Opacity	Supported	Real keyframes with per-segment cubic-bezier easing — pixel-matched to After Effects, never a stack of baked frames.
Auto-range loops	Supported	Finds the real animated window so every layer loops tight and on one shared beat.

Effects

Glow	Supported	Vector-first: blur → `filter: blur()`, AE Glow → a `drop-shadow` stack, round glows → a radial bloom. A flattened PNG only as a last resort.
Echo	Supported	AE's Echo becomes time-shifted, fading clones — generalized over any animation, not a per-case hack.
Light sweep / shine	Supported	A matte shine band, solid or gradient, riding real keyframe motion across the shape. (The CC Light Sweep effect variant is incoming.)
Draw-on strokes / Trim	Supported	Animated trim start, end and offset draw the stroke on along its path.
Adjustment layers	Supported	Fill recolor and glow apply straight to each layer beneath, per-target — no wrapper, no repaint.
Path morph — affine	Supported	Square→diamond and rotate/scale/skew morphs become pure CSS `transform: matrix()` — compositor-only.
Path morph — true shape change	Supported	Genuine contour changes (e.g. a blob) render via a tiny canvas runtime, scoped to the morphing path — see "What ships" below.

Masking & mattes

Single mask & track matte	Supported	Every matte mode including inverted — vector `clip-path` or a baked alpha mask.
Pathfinder / Merge Paths	Supported	Add, Subtract, Intersect, Difference. Solid → vector `clip-path`; gradient or Intersect → a crisp bake.
Multi-mask compositing	Incoming	More than one active mask on a single layer.
Animated mask path	Incoming	Designed; will land scoped to constant-vertex paths, since animating a mask repaints on the main thread.

Images & precomps

Smart image baking	Supported	Anything too dense for code — thick effect stacks, video, a whole precomp — bakes down to a single crisp image and ships. Everything vectors can reach stays code.
Image layers (PNG / JPG / WebP)	Supported	Copied as-is, or rendered when effects or video are applied.
Image + glow / blur	Supported	Baked to a crisp PNG; CSS animates the layer over it.
Image precomp — Bake	Supported	The whole precomp becomes one image; the host layer's transforms animate.
Image precomp — Div / per-asset	Supported	Each inner image becomes its own `<img>`, animated separately.

Systems & advanced

Particle systems	Supported	Authored in our Particle Lab, exported as native CSS: each particle is a DOM node driven by pure CSS keyframes — fast, GPU-friendly, glow included. One small scoped module spawns them — no canvas, no generic engine.
3D transforms	Partial	Per-layer 3D rotation, Z-depth and perspective, emitted only when the scene truly goes 3D. Full camera/light rigs and depth-sorting are incoming.
Native text layers	Incoming	Skipped for now. Workaround today: After Effects' Create Shapes from Text, which exports fully.
Puppet / mesh warp	Incoming	Real mesh deformation is a separate WebGL path (not representable as CSS); not yet wired into the panel.
Number count-up / odometer	Incoming	Planned as a compositor-safe digit-strip, not a repaint-every-frame counter.

Shapes & paths

Rectangles	Supported	Fill, gradient, stroke and corner radius — animated.
Ellipses & circles	Supported	Fill, gradient and stroke; true round corners.
Donuts & rings	Supported	Including a keyframed (animated) hole radius.
Custom pen paths	Supported	Arbitrary bezier shapes as inline SVG — fill, gradient and stroke.
Shapes from Text	Supported	Per-letter and per-group transforms, staggered reveals.

Fills & color

Solid & animated fill	Supported	Color and color-over-time, as native CSS.
Gradients — linear & radial	Supported	Sampled pixel-accurate from After Effects; radial on ellipses, donuts and pen paths.
Transparent / alpha gradients	Supported	Alpha-aware sampling, emitted as `rgba()` stops.

What ships

What lands in your export — and what never does.

Your animation becomes the page, not a payload it loads.

Zero runtime, by default

Shapes, gradients, masks, transforms, easing, affine morphs and images all export as plain HTML and CSS. No JavaScript, no JSON, no player to download or parse. The CSS is the animation.

A tiny runtime, only for two effects

Two things genuinely can't be pure CSS: particle systems and true shape-morphing (a real contour change, not a rotate or scale). Those ship one small, purpose-built animation-runtime.js — a few kilobytes scoped to that effect. Not a generic interpreter, not a Lottie-style player — and omitted entirely when your comp uses neither.

your-export/
  animation.html        ← semantic markup, minimal DOM
  animation.css         ← every transform, gradient & keyframe — pure CSS
  animation-runtime.js  ← OPTIONAL — only if you used particles or true morph
  images/               ← baked PNG/JPG assets, when needed
  masks/                ← baked alpha masks, when a mask needs one

JSON only lives in our tooling — the Particle Lab manifest you author against, plus dev diagnostics. It never leaves After Effects: nothing JSON-shaped, and no generic player, is written to your export.

"Lottie loads one general-purpose JSON player on every animation. AE2CSS loads nothing by default — and at most a small module for a single effect."

Don't see your animation?

The motion it can't read yet is our roadmap. Flag it in one click from inside After Effects — the most-requested gaps get built first and arrive through the updater.

Download for macOS How feature requests work →