Skip to main content

FeaturesSection

The FeaturesSection component highlights product features in an interactive layout.

Usage​

import FeaturesSection from "@/components/homepage/FeaturesSection";
import { config } from "@/config";
function HomePage() {
  return <FeaturesSection {...config.homepage.featuresSection} />;
}

Props​

  • title: The main title of the features section
  • description: A brief description of the features
  • useTabLayout: Boolean to toggle between tab and accordion layouts
  • features: An array of feature objects, each containing:
    • title: The feature title
    • description: The feature description
    • icon: An icon component
    • image: The path to the feature image

Functionality​

  • Displays product features in either a tab or accordion layout
  • Supports icons and images for each feature
  • Provides interactive selection of features

Customization​

The component uses Tailwind CSS and Framer Motion for styling and animations. You can customize the appearance by modifying the CSS classes or updating the animation configurations.