Merge version_1 into main #1
273
src/app/page.tsx
273
src/app/page.tsx
@@ -32,26 +32,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Explore",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Your Skin",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Transformations",
|
||||
id: "metrics",
|
||||
},
|
||||
{
|
||||
name: "AI Guidance",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Philosophy",
|
||||
id: "about",
|
||||
},
|
||||
{ name: "Explore", id: "hero" },
|
||||
{ name: "Your Skin", id: "features" },
|
||||
{ name: "Transformations", id: "metrics" },
|
||||
{ name: "AI Guidance", id: "faq" },
|
||||
{ name: "Philosophy", id: "about" },
|
||||
]}
|
||||
brandName="Nuvé"
|
||||
/>
|
||||
@@ -60,52 +45,22 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Unlock your skin's potential"
|
||||
description="Our AI scans your face and shows what can be improved for a lifetime of health and radiance."
|
||||
kpis={[
|
||||
{
|
||||
value: "95%",
|
||||
label: "accurate skin analysis",
|
||||
},
|
||||
{
|
||||
value: "30+",
|
||||
label: "skin concerns analyzed",
|
||||
},
|
||||
{
|
||||
value: "7-day",
|
||||
label: "personalized routine",
|
||||
},
|
||||
{ value: "95%", label: "accurate skin analysis" },
|
||||
{ value: "30+", label: "skin concerns analyzed" },
|
||||
{ value: "7-day", label: "personalized routine" },
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Analyze Skin",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Analyze Skin", href: "#contact" }]}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",
|
||||
alt: "person portrait",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/positive-guy-with-african-hairstyle-dark-skin-wearing-elegant-white-shirt_273609-14032.jpg",
|
||||
alt: "person portrait",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100279.jpg",
|
||||
alt: "person portrait",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",
|
||||
alt: "Happy businessman smiling at camera",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/confident-woman-professional-attire_23-2152009547.jpg",
|
||||
alt: "Confident woman in professional attire",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg", alt: "person portrait" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/positive-guy-with-african-hairstyle-dark-skin-wearing-elegant-white-shirt_273609-14032.jpg", alt: "person portrait" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100279.jpg", alt: "person portrait" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg", alt: "person portrait" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/confident-woman-professional-attire_23-2152009547.jpg", alt: "person portrait" },
|
||||
]}
|
||||
avatarText="Trusted by 10,000+ users"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/3d-network-background-with-connecting-lines-dots_1048-9850.jpg"
|
||||
@@ -121,41 +76,18 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Precision AI Scans",
|
||||
description: "High resolution facial scanning technology.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Scan,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-finance-employment-female-successful-entrepreneurs-concept-good-looking-asian-businesswoman-glasses-suit-smiling-friendly-confident-working-office_1258-59394.jpg",
|
||||
imageAlt: "Business, finance and employment, female successful entrepreneurs concept. Good-looking asian businesswoman in glasses and suit smiling friendly and confident, working in office",
|
||||
title: "Precision AI Scans", description: "High resolution facial scanning technology.", bentoComponent: "reveal-icon", icon: Scan
|
||||
},
|
||||
{
|
||||
title: "Data Insights",
|
||||
description: "Real-time tracking of skin hydration, pores, and tone.",
|
||||
bentoComponent: "line-chart",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",
|
||||
imageAlt: "Business, finance and employment, female successful entrepreneurs concept. Good-looking asian businesswoman in glasses and suit smiling friendly and confident, working in office",
|
||||
title: "Data Insights", description: "Real-time tracking of skin hydration, pores, and tone.", bentoComponent: "line-chart"
|
||||
},
|
||||
{
|
||||
title: "Routine Optimization",
|
||||
description: "Adaptive routines based on daily climate and skin shifts.",
|
||||
bentoComponent: "orbiting-icons",
|
||||
centerIcon: Sparkles,
|
||||
title: "Routine Optimization", description: "Adaptive routines based on daily climate and skin shifts.", bentoComponent: "orbiting-icons", centerIcon: Sparkles,
|
||||
items: [
|
||||
{
|
||||
icon: Droplets,
|
||||
ring: 1,
|
||||
},
|
||||
{
|
||||
icon: Sun,
|
||||
ring: 2,
|
||||
},
|
||||
{
|
||||
icon: Moon,
|
||||
ring: 3,
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-guy-with-african-hairstyle-dark-skin-wearing-elegant-white-shirt_273609-14032.jpg",
|
||||
imageAlt: "Business, finance and employment, female successful entrepreneurs concept. Good-looking asian businesswoman in glasses and suit smiling friendly and confident, working in office",
|
||||
{ icon: Droplets, ring: 1 },
|
||||
{ icon: Sun, ring: 2 },
|
||||
{ icon: Moon, ring: 3 },
|
||||
]
|
||||
},
|
||||
]}
|
||||
title="Advanced Technology"
|
||||
@@ -169,27 +101,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "98%",
|
||||
title: "Satisfaction",
|
||||
description: "Users notice significant changes in just weeks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/exclamation-mark-blue-background-flat-lay_169016-29459.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "5M",
|
||||
title: "Scans Performed",
|
||||
description: "Expanding our AI intelligence globally.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-hands-with-coffee-cup-isolated-white_107791-17342.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "150+",
|
||||
title: "Formulations",
|
||||
description: "Verified dermatological care pathways.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/motivational-writing-male-icon_23-2148012013.jpg",
|
||||
},
|
||||
{ id: "m1", value: "98%", title: "Satisfaction", description: "Users notice significant changes in just weeks.", imageSrc: "http://img.b2bpic.net/free-photo/exclamation-mark-blue-background-flat-lay_169016-29459.jpg" },
|
||||
{ id: "m2", value: "5M", title: "Scans Performed", description: "Expanding our AI intelligence globally.", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-hands-with-coffee-cup-isolated-white_107791-17342.jpg" },
|
||||
{ id: "m3", value: "150+", title: "Formulations", description: "Verified dermatological care pathways.", imageSrc: "http://img.b2bpic.net/free-photo/motivational-writing-male-icon_23-2148012013.jpg" },
|
||||
]}
|
||||
title="Scientific Results"
|
||||
description="Measuring excellence in every drop, scan, and care protocol."
|
||||
@@ -202,46 +116,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
handle: "@sarahskin",
|
||||
testimonial: "The AI analysis is incredibly accurate.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-woman-with-natural-curly-hairstyle-smiling-positive-emotion-happy-isolated-denim-blue-shirt_285396-134.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark D.",
|
||||
handle: "@mdskincare",
|
||||
testimonial: "Finally, a routine that adapts to my environment.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-african-guy-smiling-student-confident-his-future-career-head-hunter-dream-standing-white-wall_176420-12537.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elena P.",
|
||||
handle: "@elenaglow",
|
||||
testimonial: "Nuvé is the future of cosmetic science.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-slim-woman-riding-bicycle-sport-morning-sunrise-summer-beach-sports-fitness-wear-active-healthy-lifestyle-smiling-happy-having-fun_285396-5578.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "James L.",
|
||||
handle: "@jlsolutions",
|
||||
testimonial: "Simple, clean, and effective.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/serious-self-assured-man-with-curly-hair-looks-with-concentrated-expression-dressed-white-shirt-listens-attentively_273609-17084.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Chloe M.",
|
||||
handle: "@chloem",
|
||||
testimonial: "My skin has never been healthier.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-amused-enthusiastic-good-looking-malaysian-woman-smiling-feeling-positive_176420-44079.jpg",
|
||||
},
|
||||
{ id: "t1", name: "Sarah J.", handle: "@sarahskin", testimonial: "The AI analysis is incredibly accurate.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-woman-with-natural-curly-hairstyle-smiling-positive-emotion-happy-isolated-denim-blue-shirt_285396-134.jpg" },
|
||||
{ id: "t2", name: "Mark D.", handle: "@mdskincare", testimonial: "Finally, a routine that adapts to my environment.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-african-guy-smiling-student-confident-his-future-career-head-hunter-dream-standing-white-wall_176420-12537.jpg" },
|
||||
{ id: "t3", name: "Elena P.", handle: "@elenaglow", testimonial: "Nuvé is the future of cosmetic science.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-slim-woman-riding-bicycle-sport-morning-sunrise-summer-beach-sports-fitness-wear-active-healthy-lifestyle-smiling-happy-having-fun_285396-5578.jpg" },
|
||||
{ id: "t4", name: "James L.", handle: "@jlsolutions", testimonial: "Simple, clean, and effective.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/serious-self-assured-man-with-curly-hair-looks-with-concentrated-expression-dressed-white-shirt-listens-attentively_273609-17084.jpg" },
|
||||
{ id: "t5", name: "Chloe M.", handle: "@chloem", testimonial: "My skin has never been healthier.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-amused-enthusiastic-good-looking-malaysian-woman-smiling-feeling-positive_176420-44079.jpg" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Loved by skin enthusiasts"
|
||||
@@ -255,39 +134,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Essentials",
|
||||
price: "$49",
|
||||
subtitle: "Monthly scan & basic routine",
|
||||
features: [
|
||||
"Daily Skin Analysis",
|
||||
"Routine Tracker",
|
||||
"Basic Ingredient Tips",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Elite",
|
||||
price: "$99",
|
||||
subtitle: "Advanced scans & dermatology support",
|
||||
features: [
|
||||
"Advanced Diagnostics",
|
||||
"1-on-1 Consultation",
|
||||
"Adaptive Formula Kits",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Pro",
|
||||
price: "$199",
|
||||
subtitle: "Full clinical care & unlimited updates",
|
||||
features: [
|
||||
"Priority Support",
|
||||
"Bi-weekly Consults",
|
||||
"Premium Kit Access",
|
||||
],
|
||||
},
|
||||
{ id: "p1", badge: "Essentials", price: "$49", subtitle: "Monthly scan & basic routine", features: ["Daily Skin Analysis", "Routine Tracker", "Basic Ingredient Tips"] },
|
||||
{ id: "p2", badge: "Elite", price: "$99", subtitle: "Advanced scans & dermatology support", features: ["Advanced Diagnostics", "1-on-1 Consultation", "Adaptive Formula Kits"] },
|
||||
{ id: "p3", badge: "Pro", price: "$199", subtitle: "Full clinical care & unlimited updates", features: ["Priority Support", "Bi-weekly Consults", "Premium Kit Access"] },
|
||||
]}
|
||||
title="Personalized Care Tiers"
|
||||
description="Choose the level of AI-driven care that fits your lifestyle perfectly."
|
||||
@@ -299,9 +148,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Our Philosophy"
|
||||
description={[
|
||||
"At Nuvé, we believe every individual skin is unique. We combine biological science with advanced AI to create routines that honor your natural glow.",
|
||||
"Our goal is simple: accessibility and clarity in skincare, ensuring everyone knows exactly what their skin needs to thrive.",
|
||||
]}
|
||||
"At Nuvé, we believe every individual skin is unique. We combine biological science with advanced AI to create routines that honor your natural glow.", "Our goal is simple: accessibility and clarity in skincare, ensuring everyone knows exactly what their skin needs to thrive."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -310,21 +157,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How does the AI scan work?",
|
||||
content: "Our proprietary software analyzes light reflection and skin texture.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Is my data private?",
|
||||
content: "Absolutely. All scans are encrypted.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I cancel my plan?",
|
||||
content: "Yes, you can cancel at any time.",
|
||||
},
|
||||
{ id: "f1", title: "How does the AI scan work?", content: "Our proprietary software analyzes light reflection and skin texture." },
|
||||
{ id: "f2", title: "Is my data private?", content: "Absolutely. All scans are encrypted." },
|
||||
{ id: "f3", title: "Can I cancel my plan?", content: "Yes, you can cancel at any time." },
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Everything you need to know about starting your skin transformation journey."
|
||||
@@ -335,9 +170,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Get Started"
|
||||
title="Start your journey"
|
||||
description="Join thousands of users who have transformed their skin."
|
||||
@@ -350,34 +183,10 @@ export default function LandingPage() {
|
||||
logoText="Nuvé"
|
||||
columns={[
|
||||
{
|
||||
title: "Platform",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
],
|
||||
title: "Platform", items: [{ label: "Home", href: "#hero" }, { label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Use",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Use", href: "#" }],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -385,4 +194,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user