Animated Checkbox

Animated checkbox with spring transitions and strike-through text effect.

Buy groceries

Walk the dog

Write some code

"use client";

import { AnimatedCheckbox } from "@/components/vritti/animated-checkbox";

export function AnimatedCheckboxExample() {
  return (
    <div className="flex flex-col items-center justify-center gap-4 p-8">
      <AnimatedCheckbox title="Buy groceries" />
      <AnimatedCheckbox title="Walk the dog" defaultChecked />
      <AnimatedCheckbox title="Write some code" />
    </div>
  );
}

Installation


pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/animated-checkbox"

Dependencies


pnpm add motion