Recommended
Individual License - Lifetime Access
$199
one-time paymentBeautifully crafted React + Tailwind CSS + Framer Motion components and templates for your next web project.
What's included:
- Over 50+ sections — Everything you need to build beautiful landing pages
- 5+ templates — Templates built with React, Next.js, and TailwindCSS
- Commercial Use — Use the templates for commercial projects. Re-selling of code is NOT allowed.
- Perpetual license — You own the templates, forever
- Lifetime access — Get access to everything available today, plus everything added in the future
- Lifetime updates — Get access to all future updates for the original purchase price
Recommended
Individual License - Lifetime Access
$199
one-time paymentBeautifully crafted React + Tailwind CSS + Framer Motion components and templates for your next web project.
What's included:
- Over 50+ sections — Everything you need to build beautiful landing pages
- 5+ templates — Templates built with React, Next.js, and TailwindCSS
- Commercial Use — Use the templates for commercial projects. Re-selling of code is NOT allowed.
- Perpetual license — You own the templates, forever
- Lifetime access — Get access to everything available today, plus everything added in the future
- Lifetime updates — Get access to all future updates for the original purchase price
Installation
You need to first install the @radix-ui/react-accordion
package to get started.
npm install @radix-ui/react-accordion
Tailwind Configuration
Then copy paste the following code into your tailwind.config.ts
file.
/** @type {import('tailwindcss').Config} */
module.exports = {
theme: {
extend: {
animation: {
"slide-down": "slide-down 300ms cubic-bezier(0.87, 0, 0.13, 1)",
"slide-up": "slide-up 300ms cubic-bezier(0.87, 0, 0.13, 1)",
},
keyframes: {
"slide-down": {
from: { height: "0px" },
to: { height: "var(--radix-accordion-content-height)" },
},
"slide-up": {
from: { height: "var(--radix-accordion-content-height)" },
to: { height: "0px" },
},
},
},
},
}