DocsIntroduction
Static and Animated Component Collection
Used with Next.js, TailwindCSS and sometimes with Framer-Motion. All components fully support light and dark modes
Author: @lukachodonadze
Requirements
- Next.js
- TailwindCSS
- Framer Motion (sometimes)
- next-themes (optional)
Go ahead and create required functions and install deps.
Font - Geist Sans
npm i geistDependencies
npm i clsx tailwind-merge framer-motionCreate @/utils/cn.ts file
import { ClassValue, clsx } from "clsx";
import { twMerge } from "tailwind-merge";
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}This cn function merges tailwind classes. Very helpful if you want to edit classNames through props.
