Getting Started

Introduction

dotLottie-wc is a web component that allows you to easily embed Lottie animations in your web applications. It is a wrapper around the dotLottie-web library.

Installation

npm install @lottiefiles/dotlottie-wc

Basic Usage

Via npm

After installation, you can use dotlottie-wc in your HTML file:

<dotlottie-wc src="https://lottie.host/4db68bbd-31f6-4cd8-84eb-189de081159a/IGmMCqhzpt.lottie" autoplay="true" loop="true"></dotlottie-wc>

And import it in your JavaScript or TypeScript module:

import '@lottiefiles/dotlottie-wc';

Via CDN

You can also use the component directly via a npm CDN:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@lottiefiles/dotlottie-wc | Basic Example</title>
</head>
<body>
    <dotlottie-wc src="https://lottie.host/4db68bbd-31f6-4cd8-84eb-189de081159a/IGmMCqhzpt.lottie" autoplay loop></dotlottie-wc>
    <script type="module" src="https://unpkg.com/@lottiefiles/dotlottie-wc@latest/dist/dotlottie-wc.js"></script>
</body>
</html>