1--- 2title: 'Skottie - Lottie Animation Player' 3linkTitle: 'Skottie - Lottie Animation Player' 4 5weight: 10 6--- 7 8Skia now offers a performant, secure native player for JSON animations derived 9from the Bodymovin plugin for After Effects. It can be used on any platform 10where you are using Skia, including Android & iOS. 11 12The player aims to build upon the Lottie player widely used for animations 13today, improving on the performance, feature set, and platform cohesiveness for 14our clients. We are big fans of the Bodymovin format and where possible, 15contributing advancements back to Bodymovin/Lottie. 16 17<br> 18 19## Sample JSON animations 20 21Here are some test samples rendering with Skia's animation player: 22 23<script src="https://skottie.skia.org/static/canvaskit.js"></script> 24<script src="https://skottie.skia.org/static/inline-bundle.js"></script> 25<style> 26 skottie-inline-sk { 27 display: inline-block; 28 } 29</style> 30 31<a href="https://skottie.skia.org/e6741dda67629da1f80c254dad3df865"> 32 <skottie-inline-sk src="https://skottie.skia.org/_/j/e6741dda67629da1f80c254dad3df865" width=200 height=200></skottie-inline-sk> 33</a> 34<a href="https://skottie.skia.org/ffea72cf6be48fa061671c124ed7789c"> 35 <skottie-inline-sk src="https://skottie.skia.org/_/j/ffea72cf6be48fa061671c124ed7789c" width=200 height=200></skottie-inline-sk> 36</a> 37<a href="https://skottie.skia.org/00e850cdbed7304985eaefe98a4e8a9c"> 38 <skottie-inline-sk src="https://skottie.skia.org/_/j/00e850cdbed7304985eaefe98a4e8a9c" width=200 height=200></skottie-inline-sk> 39</a> 40<a href="https://skottie.skia.org/e1aca009d5ebec9bd122b87b018bb673"> 41 <skottie-inline-sk src="https://skottie.skia.org/_/j/e1aca009d5ebec9bd122b87b018bb673" width=200 height=200></skottie-inline-sk> 42</a> 43<a href="https://skottie.skia.org/821fd79dd7437b97ba891e7a00970a06"> 44 <skottie-inline-sk src="https://skottie.skia.org/_/j/821fd79dd7437b97ba891e7a00970a06" width=200 height=200></skottie-inline-sk> 45</a> 46<a href="https://skottie.skia.org/ad63f250084685c96edd9b52ae2f436b"> 47 <skottie-inline-sk src="https://skottie.skia.org/_/j/ad63f250084685c96edd9b52ae2f436b" width=200 height=200></skottie-inline-sk> 48</a> 49<a href="https://skottie.skia.org/40f78ddc751c16348a08e1d61d3e78b1"> 50 <skottie-inline-sk src="https://skottie.skia.org/_/j/40f78ddc751c16348a08e1d61d3e78b1" width=200 height=200></skottie-inline-sk> 51</a> 52<a href="https://skottie.skia.org/fc42db7c75741437b5cb0e90b3febc65"> 53 <skottie-inline-sk src="https://skottie.skia.org/_/j/fc42db7c75741437b5cb0e90b3febc65" width=200 height=200></skottie-inline-sk> 54</a> 55<a href="https://skottie.skia.org/c16eee287f2cea44102b6670c66e60ab"> 56 <skottie-inline-sk src="https://skottie.skia.org/_/j/c16eee287f2cea44102b6670c66e60ab" width=200 height=200></skottie-inline-sk> 57</a> 58 59\*Sample animations courtesy of the lottiefiles.com community 60 61<br> 62 63## Test server 64 65Test your Lottie files in our player at https://skottie.skia.org 66 67<br> 68 69## The code 70 71Skia's animation code entry point can be found here on 72[Googlesource](https://skia.googlesource.com/skia/+/main/modules/skottie/include/Skottie.h) 73and 74[GitHub](https://github.com/google/skia/blob/main/modules/skottie/include/Skottie.h). 75The code is part of Skia's library but can also be made available as a separate 76package. 77 78<br> 79 80## Embedding examples 81 82Sample C code for using the Skottie native player can be found 83[here](https://github.com/google/skia/blob/main/modules/skottie/src/SkottieTool.cpp). 84 85Android app code for inspiration can be found 86[here](https://github.com/google/skia/tree/main/platform_tools/android/apps/skottie). 87 88Example code embedding Skottie into our Viewer app is 89[here](https://github.com/google/skia/blob/main/tools/viewer/SkottieSlide.cpp). 90 91The Viewer or Skottie Android apps can be built following 92[these](/docs/user/sample/viewer) instructions. 93