Third-party plugins

Animation

Enhance your projects effortlessly with Tailwindcss Motion, a powerful Tailwind CSS plugin offering a range of pre-designed motion classes for seamless animation integration.

Getting started

Setup

Easily unlock a range of pre-built animation classes by integrating <a href="https://rombo.co/tailwind/" target="_blank" class="link link-primary font-semibold">tailwindcss-motion</a> with Semji. To enable scroll-based functionality in Semji, simply integrate <a href="https://github.com/heidkaemper/tailwindcss-intersect" target="_blank" class="link link-primary font-semibold">tailwindcss-intersect</a>. Just follow these simple steps to get started:

  • More Animations
User Avatar
Total page views
89,400
21% ↗︎ than last month
JavaScript
import { Observer } from 'tailwindcss-intersect';
 
Observer.start();

Illustration

Animated avatar group

Demonstrates animated avatar groups using the `tailwindcss-motion` plugin.

avatar
avatar
avatar
avatar

Animated button

Here are example of interactive button with unique motion effect designed with the `tailwindcss-motion` plugin.

Animated Card

This example demonstrates using `tailwindcss-motion` and `tailwindcss-intersect` plugins to create scroll-based animated cards.

headphone
Airpods Max

A perfect balance of exhilarating high-fidelity audio and the effortless magic of Airpods.

Animated List

This example demonstrates leveraging `tailwindcss-motion` and `tailwindcss-intersect` plugins to create a seamlessly scroll-animated list.

  • New Message(13)
  • Your ride is waiting outside
  • You forget something in your cart
  • New series just dropped

Animate your pages seamlessly

Enhance your pages with smooth scroll-based animations and dynamic transitions using the tailwindcss-motion and tailwindcss-intersect plugins.

Order
7,500 of 10,000 orders
Revenue
$45,000 of $100,000
Invoice
$18,200 of $25,000

Track Your Stats

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum