# Lottielab Docs

## Lottielab Docs

- [Welcome to Lottielab](https://docs.lottielab.com/getting-started/welcome-to-lottielab)
- [Tutorials](https://docs.lottielab.com/getting-started/tutorials)
- [Design vs Animate mode](https://docs.lottielab.com/getting-started/design-vs-animate-mode)
- [Keyboard Shortcuts](https://docs.lottielab.com/getting-started/keyboard-shortcuts)
- [FAQ](https://docs.lottielab.com/getting-started/faq)
- [Dashboard UI Overview](https://docs.lottielab.com/file-management/dashboard-ui-overview)
- [Files](https://docs.lottielab.com/file-management/files): Your animations are saved as Files in Lottielab. Here are a few actions you can take with your Files to better work with or manage them.
- [Create a file](https://docs.lottielab.com/file-management/files/create-a-file)
- [Import a file](https://docs.lottielab.com/file-management/files/import-a-file)
- [Duplicate a file](https://docs.lottielab.com/file-management/files/duplicate-a-file)
- [Export a file](https://docs.lottielab.com/file-management/files/export-a-file)
- [Move a file](https://docs.lottielab.com/file-management/files/move-a-file)
- [Share link to file](https://docs.lottielab.com/file-management/files/share-link-to-file)
- [Rename a file](https://docs.lottielab.com/file-management/files/rename-a-file)
- [Teams](https://docs.lottielab.com/file-management/teams)
- [Create a team](https://docs.lottielab.com/file-management/teams/create-a-team)
- [Invite team members](https://docs.lottielab.com/file-management/teams/invite-team-members)
- [Rename a team](https://docs.lottielab.com/file-management/teams/rename-a-team)
- [Folders](https://docs.lottielab.com/file-management/folders)
- [Create a folder](https://docs.lottielab.com/file-management/folders/create-a-folder)
- [Rename a folder](https://docs.lottielab.com/file-management/folders/rename-a-folder)
- [Delete a folder](https://docs.lottielab.com/file-management/folders/delete-a-folder)
- [Editor UI Overview](https://docs.lottielab.com/editor/editor-ui-overview)
- [Tools](https://docs.lottielab.com/editor/tools): Your animations are saved as Files in Lottielab. Here are a few actions you can take with your Files"
- [Selection Tools](https://docs.lottielab.com/editor/tools/selection-tools): The selection tools allow you to interact with your canvas and the layers on it in various ways.
- [Shape Tools](https://docs.lottielab.com/editor/tools/shape-tools): The shape tools allow you to create basic shapes like the Rectangle or Ellipse on your artboard, so you can further edit or animate them.
- [Pen tool and paths](https://docs.lottielab.com/editor/tools/pen-tool-and-paths): Already have assets you'd like to get started with, you can import a Lottie or SVG file directly from your dashboard
- [Create a path](https://docs.lottielab.com/editor/tools/pen-tool-and-paths/create-a-path)
- [Curve a path](https://docs.lottielab.com/editor/tools/pen-tool-and-paths/curve-a-path)
- [Add a point on a path](https://docs.lottielab.com/editor/tools/pen-tool-and-paths/add-a-point-on-a-path)
- [Delete a point on a path](https://docs.lottielab.com/editor/tools/pen-tool-and-paths/delete-a-point-on-a-path)
- [Convert shape to path](https://docs.lottielab.com/editor/tools/pen-tool-and-paths/convert-shape-to-path)
- [Import](https://docs.lottielab.com/editor/tools/import)
- [Layer mask](https://docs.lottielab.com/editor/tools/layer-mask)
- [Animating](https://docs.lottielab.com/editor/animating)
- [Design vs Animate mode](https://docs.lottielab.com/editor/animating/design-vs-animate-mode)
- [Auto-animate](https://docs.lottielab.com/editor/animating/auto-animate)
- [Timeline](https://docs.lottielab.com/editor/animating/timeline)
- [Duration and playback](https://docs.lottielab.com/editor/animating/timeline/duration-and-playback)
- [Playhead and controls](https://docs.lottielab.com/editor/animating/timeline/playhead-and-controls)
- [Keyframes](https://docs.lottielab.com/editor/animating/timeline/keyframes)
- [Add a keyframe](https://docs.lottielab.com/editor/animating/timeline/keyframes/add-a-keyframe)
- [Duplicate keyframes](https://docs.lottielab.com/editor/animating/timeline/keyframes/duplicate-keyframes)
- [Keyframe thumbnails](https://docs.lottielab.com/editor/animating/timeline/keyframes/keyframe-thumbnails)
- [Transition bar](https://docs.lottielab.com/editor/animating/timeline/transition-bar)
- [Layers and properties](https://docs.lottielab.com/editor/animating/timeline/layers-and-properties)
- [Easing](https://docs.lottielab.com/editor/animating/easing)
- [Add easing](https://docs.lottielab.com/editor/animating/easing/add-easing)
- [Custom easing](https://docs.lottielab.com/editor/animating/easing/custom-easing)
- [Speed Graph](https://docs.lottielab.com/editor/animating/easing/custom-easing/speed-graph)
- [Anticipation](https://docs.lottielab.com/editor/animating/easing/custom-easing/anticipation)
- [Overshoot](https://docs.lottielab.com/editor/animating/easing/custom-easing/overshoot)
- [Easing presets](https://docs.lottielab.com/editor/animating/easing/easing-presets)
- [Organising Layers](https://docs.lottielab.com/editor/organising-layers): Your animations are saved as Files in Lottielab. Here are a few actions you can take with your Files"
- [Layer actions](https://docs.lottielab.com/editor/organising-layers/layer-actions)
- [Select/ Multi-select layers](https://docs.lottielab.com/editor/organising-layers/layer-actions/select-multi-select-layers)
- [Rename a layer](https://docs.lottielab.com/editor/organising-layers/layer-actions/rename-a-layer)
- [Align layers on canvas](https://docs.lottielab.com/editor/organising-layers/layer-actions/align-layers-on-canvas)
- [Re-order layers](https://docs.lottielab.com/editor/organising-layers/layer-actions/re-order-layers)
- [Delete a layer](https://docs.lottielab.com/editor/organising-layers/layer-actions/delete-a-layer)
- [Hide a layer](https://docs.lottielab.com/editor/organising-layers/layer-actions/hide-a-layer)
- [Lock a layer](https://docs.lottielab.com/editor/organising-layers/layer-actions/lock-a-layer)
- [Groups](https://docs.lottielab.com/editor/organising-layers/groups)
- [Grouping layers](https://docs.lottielab.com/editor/organising-layers/groups/grouping-layers)
- [Ungroup layers](https://docs.lottielab.com/editor/organising-layers/groups/ungroup-layers)
- [Properties](https://docs.lottielab.com/editor/properties)
- [Transform](https://docs.lottielab.com/editor/properties/transform)
- [Position](https://docs.lottielab.com/editor/properties/transform/position)
- [Scale](https://docs.lottielab.com/editor/properties/transform/scale)
- [Size/ Dimensions](https://docs.lottielab.com/editor/properties/transform/size-dimensions)
- [Rotation](https://docs.lottielab.com/editor/properties/transform/rotation)
- [Skew](https://docs.lottielab.com/editor/properties/transform/skew)
- [Anchor Point (Origin)](https://docs.lottielab.com/editor/properties/transform/anchor-point-origin)
- [Corner Radius](https://docs.lottielab.com/editor/properties/transform/corner-radius)
- [Visibility](https://docs.lottielab.com/editor/properties/visibility)
- [Fill/ Color](https://docs.lottielab.com/editor/properties/fill-color)
- [Add/ change fill color](https://docs.lottielab.com/editor/properties/fill-color/add-change-fill-color)
- [Gradient](https://docs.lottielab.com/editor/properties/fill-color/gradient)
- [Linear gradient](https://docs.lottielab.com/editor/properties/fill-color/gradient/linear-gradient)
- [Radial gradient](https://docs.lottielab.com/editor/properties/fill-color/gradient/radial-gradient)
- [Gradient stops](https://docs.lottielab.com/editor/properties/fill-color/gradient/gradient-stops)
- [Gradient handles (width and direction)](https://docs.lottielab.com/editor/properties/fill-color/gradient/gradient-handles-width-and-direction)
- [Eye dropper](https://docs.lottielab.com/editor/properties/fill-color/eye-dropper)
- [Fill Opacity](https://docs.lottielab.com/editor/properties/fill-color/fill-opacity)
- [Document colors](https://docs.lottielab.com/editor/properties/fill-color/document-colors)
- [Color model](https://docs.lottielab.com/editor/properties/fill-color/color-model): Hex code, RGB andHSL
- [Stroke](https://docs.lottielab.com/editor/properties/stroke)
- [Reveal Path (Trim path)](https://docs.lottielab.com/editor/properties/reveal-path-trim-path)
- [Canvas](https://docs.lottielab.com/editor/canvas)
- [Artboard properties](https://docs.lottielab.com/editor/canvas/artboard-properties)
- [Layer controls (HUDs)](https://docs.lottielab.com/editor/canvas/layer-controls-huds)
- [Layer transform controls](https://docs.lottielab.com/editor/canvas/layer-controls-huds/layer-transform-controls)
- [Motion Path](https://docs.lottielab.com/editor/canvas/layer-controls-huds/motion-path)
- [Create a motion path](https://docs.lottielab.com/editor/canvas/layer-controls-huds/motion-path/create-a-motion-path)
- [Curving a motion path](https://docs.lottielab.com/editor/canvas/layer-controls-huds/motion-path/curving-a-motion-path)
- [Motion path easing](https://docs.lottielab.com/editor/canvas/layer-controls-huds/motion-path/motion-path-easing)
- [Zoom](https://docs.lottielab.com/editor/canvas/zoom)
- [Animation Duration](https://docs.lottielab.com/editor/canvas/animation-duration)
- [Interactivity](https://docs.lottielab.com/editor/interactivity): An introduction to creating Interactive Lotties with state machines using Lottielab.
- [Intro to Interactivity](https://docs.lottielab.com/editor/interactivity/intro-to-interactivity): A guide on getting started with creating Interactive Lotties using Lottielab.
- [States](https://docs.lottielab.com/editor/interactivity/states): In-depth reference about the basic building block of Lottielab Interactivity.
- [Interactions](https://docs.lottielab.com/editor/interactivity/interactions): In-depth reference on interactions in Interactive Lotties, and how to use them to achieve rich, reactive animations and components.
- [Formulas](https://docs.lottielab.com/editor/interactivity/formulas): Reference manual for the advanced Custom formula feature.
- [Using Interactive Lotties](https://docs.lottielab.com/editor/interactivity/using-interactive-lotties): Options for exporting, embedding and playing Interactive Lotties on your own websites and apps.
- [Share link to file](https://docs.lottielab.com/export-and-hand-off/share-link-to-file)
- [Livelink (CDN)](https://docs.lottielab.com/export-and-hand-off/livelink-cdn): Everything you need to know about Lottielab's powerful Lottie hosting, versioning and optimisation feature.
- [Optimisation](https://docs.lottielab.com/export-and-hand-off/livelink-cdn/optimisation): A primer on the Livelink displayed size, optimisation percentage, and what it all means.
- [Customising embed links](https://docs.lottielab.com/export-and-hand-off/livelink-cdn/customising-embed-links): The Lottie Embed Link supports several URL (query) parameters which can be used to control how the Lottie will be played when you embed or otherwise use this link.
- [Code Export Platforms](https://docs.lottielab.com/export-and-hand-off/code-export-platforms)
- [Web](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web)
- [JavaScript (Vanilla)](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/javascript-vanilla)
- [React JS](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/react-js)
- [Angular](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/angular)
- [Vue JS](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/vue-js)
- [Webflow](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/webflow)
- [Framer](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/framer): This guide covers three methods: adding static Lottie animations, creating interactive Lotties with custom Framer interactions, and importing interactive Lotties with preserved Lottielab interactions.
- [Wordpress](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/web/wordpress)
- [Mobile](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/mobile): Your animations are saved as Files in Lottielab. Here are a few actions you can take with your Files"
- [iOS](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/mobile/ios)
- [Android](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/mobile/android)
- [React Native](https://docs.lottielab.com/export-and-hand-off/code-export-platforms/mobile/react-native)
- [File download](https://docs.lottielab.com/export-and-hand-off/file-download)
- [Lottie JSON download](https://docs.lottielab.com/export-and-hand-off/file-download/lottie-json-download)
- [GIF download](https://docs.lottielab.com/export-and-hand-off/file-download/gif-download)
- [MP4 download](https://docs.lottielab.com/export-and-hand-off/file-download/mp4-download)