Back to the blog

Animation

Your colours, in a Lottie you already have.

Change a Lottie's colours in your browser, nothing uploaded: every colour it uses in one list, each changed everywhere at once, saved as the same kind of file.

By 4 min read

A teal star on an artboard, drawn three times as it turns and grows, over a timeline with keys for its turn, size and opacity and the easing curve beside them

An animation bought or downloaded in someone else's colours is the Lottie that most often needs changing. KeepSimp's Lottie colour editor finds every colour in the file and changes each one everywhere at once, in your browser, with nothing else touched.

Every colour, in one list.

Drop a Lottie JSON, a .lottie or a .tgs. The colour editor lists every colour the file uses: in fills, strokes, gradient stops and solid layers, inside precompositions too, whether it stays still or is animated. Each shows how often it is used.

Change one, change every use.

Choose a new colour for one in the list and every place it is used changes at once, as it plays. Nothing else in the file is changed: not its shapes, its timing, or anything the editor could not hold.

Save the same kind of file.

Download it as the kind of file it came as: a JSON stays JSON, a .lottie stays a .lottie and a .tgs stays a .tgs. It is played back by ThorVG before you get it.

To change more than its colours, open it in the Lottie editor. To work out colour codes or check contrast, use the colour utility.

Further reading

Topics: lottie color editor · change lottie colors · recolor lottie · edit lottie colors · lottie colour · lottie color change

A little less theory. A little more doing.

Try it on your own terms, with a free browser tool.

Try the tool