Showing 24 of 199 animationsBrowse All 100+ Categories
Developer Quick Start
How to use these toggle switch & buttons in your application
Download the JSON file or dotLottie asset and integrate it with your favourite framework in under 2 minutes:
// 1. Install Lottie for React / Next.js
npm install @lottiefiles/dotlottie-react
// 2. Render smooth 60 FPS animation
import { DotLottieReact } from '@lottiefiles/dotlottie-react';
export default function Loader() {
return (
<DotLottieReact
src="/animations/toggle-switch-animation.json"
loop
autoplay
style={{ width: 120, height: 120 }}
/>
);
}
npm install @lottiefiles/dotlottie-react
// 2. Render smooth 60 FPS animation
import { DotLottieReact } from '@lottiefiles/dotlottie-react';
export default function Loader() {
return (
<DotLottieReact
src="/animations/toggle-switch-animation.json"
loop
autoplay
style={{ width: 120, height: 120 }}
/>
);
}
Frequently Asked Questions
Frequently Asked Questions about Toggle Switch & Buttons
Can I trigger these toggle animations on click or state change?
Yes! Using Lottie player libraries, you can play segments on click (e.g., frames 0 to 30 for ON, and 30 to 60 for OFF) to create interactive switches.