import React from 'react' import { Navbar } from './components/Navbar' import { HeroSection } from './components/HeroSection' import { FeatureSection } from './components/FeatureSection' import { TestimonialSection } from './components/TestimonialSection' import { PricingSection } from './components/PricingSection' import { CTASection } from './components/CTASection' import { Footer } from './components/Footer' export function App() { return ( <div className="min-h-screen bg-gradient-to-b from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800 text-slate-900 dark:text-white"> <Navbar /> <main> <HeroSection /> <FeatureSection /> <TestimonialSection /> <PricingSection /> <CTASection /> </main> <Footer /> </div> ) }
I'll help you implement all these components to create a complete landing page. Let's start by creating each of the components you're importing in your App component.
I've created all the components you imported in your App component, implementing a complete landing page with:
The design uses a clean, modern aesthetic with a slate color scheme that works in both light and dark modes. All components are fully responsive and use shadcn/ui components where appropriate.
To use this landing page, you can add these components to your project and import them as shown in your App component. The page includes smooth scrolling navigation to each section using ID anchors.