Cover illustration. The files are listed under What's inside.
Animated Toggle Switches
Two-way toggle switch animations in 24 styles, including day-night, liquid fill and squash-knob, as Lottie files with CSS versions and Figma frames.
Fits your $30 budget
Added to your cart.View your cart
- Includes the Standard license: personal, commercial and client work for one person.
- Instant download after payment, plus an email with links that stay active for 30 days.
- Refund within 14 days if you haven't downloaded it yet, if it doesn't work in the supported software listed here, or if it's faulty and we can't fix it.
- Contents
- 24 animations
- File formats
- .aep, .json, .html, .css, .fig
- Supported software
- After Effects, Lottie, HTML/CSS, Figma
- Download size
- 6 MB
- Good for
- Settings screens
- Light and dark theme pickers
- Notification preferences
About this product
Switching a setting gets visible feedback here: a day-night toggle where the sun sets into a moon, a liquid track that fills, a knob that squashes as it travels, a checkmark that draws itself, and 20 more styles. Every Lottie file holds two marked segments, off-to-on and on-to-off, so a player can run the right half on each tap. CSS versions built on a native checkbox cover the 12 simpler styles.
Settings screens, theme pickers and preference panels are the natural home for these. App designers and front-end developers get both directions of every switch already keyframed, with transitions of 300 to 500 ms at 60 fps. The After Effects sources keep colors on a single control layer, and Figma frames show both states for static mockups.
What's inside
- 24 animated switches, each with off-to-on and on-to-off segments
- Day-night, liquid fill, squash knob and check-draw styles
- Transitions of 300 to 500 ms at 60 fps
- CSS versions of 12 styles built on a native checkbox
- After Effects sources with one color control layer
- Static on and off frames in Figma for mockups
License
Standard license
Included with every purchase
For one person. Use the assets in unlimited personal and commercial projects, including work you deliver to clients.
Allowed
- Create social posts and ads for a client from a social media template
- Use the same asset in as many of your projects as you like
- Design a client's website with a UI kit and hand over the finished site
- Build your startup's pitch deck from a presentation template
Not allowed
- Reselling, sharing, sublicensing or giving away the files, as they are or modified, for example on stock sites or marketplaces
- Uploading the files anywhere others can download or extract them, such as a public repository
- Letting several people work from one Standard license (a Team license covers that)
- Selling print-on-demand merchandise or templates built on the assets without an Extended license