Update src/app/pricing/page.tsx

This commit is contained in:
2026-03-17 12:55:18 +00:00
parent 26f24bdb08
commit 9324559d41

View File

@@ -1,11 +1,16 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroLogo from "@/components/sections/hero/HeroLogo";
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
import MetricCardTen from "@/components/sections/metrics/MetricCardTen";
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterBase from "@/components/sections/footer/FooterBase";
import Link from "next/link";
import { Zap, Star, Crown } from "lucide-react";
export default function PricingPage() {
const navItems = [
@@ -17,17 +22,15 @@ export default function PricingPage() {
const footerColumns = [
{
title: "Product",
items: [
{ label: "Features", href: "/#features" },
title: "Product", items: [
{ label: "Features", href: "#features" },
{ label: "Pricing", href: "/pricing" },
{ label: "How It Works", href: "/#how-it-works" },
{ label: "How It Works", href: "#how-it-works" },
{ label: "Dashboard", href: "/dashboard" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
@@ -35,8 +38,7 @@ export default function PricingPage() {
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Cookie Policy", href: "#" },
@@ -44,8 +46,7 @@ export default function PricingPage() {
],
},
{
title: "Connect",
items: [
title: "Connect", items: [
{ label: "Twitter", href: "https://twitter.com" },
{ label: "GitHub", href: "https://github.com" },
{ label: "LinkedIn", href: "https://linkedin.com" },
@@ -71,6 +72,21 @@ export default function PricingPage() {
<NavbarStyleApple brandName="UpscaleAI" navItems={navItems} />
</div>
<div id="pricing-hero" data-section="pricing-hero">
<HeroLogo
logoText="Transparent, Flexible Pricing"
description="Choose the resolution tier that fits your needs. All users get 100 free credits to start upscaling immediately. Upgrade anytime to unlock HD, 2K, or premium 4K quality."
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B4b4Bdncaq28xNR8VUFdJI5Uzq/three-tier-pricing-cards-layout-comparin-1773751778870-c48cdec5.png"
imageAlt="Pricing comparison showing three tiers: Free HD, 2K, and Premium 4K"
buttons={[
{ text: "Start Free", href: "/dashboard" },
{ text: "Compare Plans", href: "#pricing" },
]}
buttonAnimation="slide-up"
showDimOverlay={false}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardTwo
title="Simple, Transparent Pricing"
@@ -80,117 +96,105 @@ export default function PricingPage() {
animationType="slide-up"
plans={[
{
id: "hd",
badge: "Free Forever",
badgeIcon: "Zap",
price: "Free",
subtitle: "Perfect for social media",
features: [
"HD resolution (720p)",
"Unlimited uploads",
"Quick processing",
"Download results",
],
buttons: [
{
text: "Get Started",
href: "/dashboard",
},
],
id: "hd", badge: "Free Forever", badgeIcon: Zap,
price: "Free", subtitle: "Perfect for social media", features: ["HD resolution (720p)", "Unlimited uploads", "Quick processing", "Download results"],
buttons: [{ text: "Get Started", href: "/dashboard" }],
},
{
id: "2k",
badge: "Popular",
badgeIcon: "Star",
price: "10 Credits",
subtitle: "Best for creators",
features: [
"2K resolution (1440p)",
"Unlimited uploads",
"Priority processing",
"Enhanced details",
"Commercial use allowed",
],
buttons: [
{
text: "Start Now",
href: "/dashboard",
},
],
id: "2k", badge: "Popular", badgeIcon: Star,
price: "10 Credits", subtitle: "Best for creators", features: ["2K resolution (1440p)", "Unlimited uploads", "Priority processing", "Enhanced details", "Commercial use allowed"],
buttons: [{ text: "Start Now", href: "/dashboard" }],
},
{
id: "4k",
badge: "Premium",
badgeIcon: "Crown",
price: "$50",
subtitle: "For professionals",
features: [
"4K resolution (2160p)",
"Unlimited uploads",
"Express processing",
"AI enhancement",
"Batch processing",
"Premium support",
],
buttons: [
{
text: "Upgrade to 4K",
href: "/pricing",
},
],
id: "4k", badge: "Premium", badgeIcon: Crown,
price: "$50", subtitle: "For professionals", features: ["4K resolution (2160p)", "Unlimited uploads", "Express processing", "AI enhancement", "Batch processing", "Premium support"],
buttons: [{ text: "Upgrade to 4K", href: "#pricing" }],
},
]}
/>
</div>
<div id="pricing-faq" data-section="pricing-faq">
<div id="how-it-works" data-section="how-it-works">
<MetricCardTen
title="How It Works"
description="Three simple steps to transform your videos"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
metrics={[
{
id: "step-1", title: "Upload Your Video", subtitle: "Select any video file from your computer", category: "Step 1", value: "Drag & Drop"},
{
id: "step-2", title: "Choose Resolution", subtitle: "Select HD, 2K, or premium 4K upscaling", category: "Step 2", value: "Instant"},
{
id: "step-3", title: "Download Result", subtitle: "Get your upscaled video in minutes", category: "Step 3", value: "Ready"},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
title="What Our Users Say"
description="Real feedback from content creators and production professionals"
textboxLayout="default"
useInvertedBackground={false}
animationType="blur-reveal"
testimonials={[
{
id: "1", name: "Marcus Chen", handle: "@marcusproducer", testimonial: "UpscaleAI transformed our workflow. We now deliver 4K content to clients in half the time with incredible quality. The AI upscaling is remarkably natural-looking.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B4b4Bdncaq28xNR8VUFdJI5Uzq/professional-headshot-of-a-video-product-1773751764825-c02bc4fd.png", imageAlt: "Marcus Chen profile photo", icon: Star,
},
{
id: "2", name: "Sarah Williams", handle: "@sarahcreative", testimonial: "As a freelance cinematographer, this tool is a game-changer. My clients are blown away by the quality improvement. Worth every credit!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B4b4Bdncaq28xNR8VUFdJI5Uzq/professional-headshot-of-a-creative-dire-1773752000285-edbb8c31.png", imageAlt: "Sarah Williams profile photo", icon: Star,
},
{
id: "3", name: "David Rodriguez", handle: "@davidfilmmaker", testimonial: "We've cut our post-production time by 40%. The AI processing is smart, fast, and produces professional-grade results every single time.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B4b4Bdncaq28xNR8VUFdJI5Uzq/professional-headshot-of-a-cinematograph-1773751768580-b8c2b669.png", imageAlt: "David Rodriguez profile photo", icon: Star,
},
{
id: "4", name: "Emma Thompson", handle: "@emmacontent", testimonial: "Incredible platform. The free tier alone is generous, and the premium 4K option is a must-have for anyone serious about content quality.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B4b4Bdncaq28xNR8VUFdJI5Uzq/professional-headshot-of-a-content-produ-1773751780316-2f0a37b3.png", imageAlt: "Emma Thompson profile photo", icon: Star,
},
]}
speed={35}
topMarqueeDirection="left"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
sideTitle="Pricing Questions"
sideDescription="Have questions about our pricing tiers and credit system? Find answers below."
sideTitle="Common Questions"
sideDescription="Have questions about our AI video upscaling service? Find answers to the most common queries below."
textPosition="left"
useInvertedBackground={false}
faqsAnimation="blur-reveal"
faqs={[
{
id: "1",
title: "What is the difference between HD, 2K, and 4K?",
content:
"HD (720p) provides free upscaling suitable for social media. 2K (1440p) uses 10 credits per video and is ideal for creators. 4K (2160p) is our premium option at $50/month with the highest quality enhancement.",
},
id: "1", title: "What video formats are supported?", content: "We support all major video formats including MP4, MKV, AVI, MOV, WebM, and more. Maximum file size is 4GB per upload."},
{
id: "2",
title: "How many credits do I get for free?",
content:
"All new users receive 100 free credits upon signup, which provides ample opportunity to try our service at all quality levels.",
},
id: "2", title: "How long does processing take?", content: "Processing typically takes 3-5 minutes depending on video length and chosen resolution. Express processing is available with premium 4K subscription."},
{
id: "3",
title: "Can I purchase additional credits?",
content:
"Yes, additional credits can be purchased as needed. Pricing is transparent and credit validity never expires.",
},
id: "3", title: "Can I use upscaled videos commercially?", content: "Yes! Free HD upscaling is for personal use. 2K and 4K tiers allow commercial use of upscaled videos."},
{
id: "4",
title: "Is there a subscription plan?",
content:
"Our 4K premium tier is a monthly subscription at $50, which includes unlimited uploads, express processing, and priority support.",
},
id: "4", title: "Do I lose the original video?", content: "No, your original video remains on our servers for 30 days. We only store the upscaled output separately."},
{
id: "5",
title: "What happens if I run out of credits?",
content:
"You can purchase more credits or upgrade to the premium 4K plan. HD upscaling remains free indefinitely.",
},
id: "5", title: "What happens when I run out of credits?", content: "You can purchase additional credits or upgrade to a premium plan. Free HD upscaling remains available indefinitely."},
{
id: "6",
title: "Do credits roll over each month?",
content:
"Yes, unused credits do not expire and will roll over to the next month, giving you flexibility in your usage.",
},
id: "6", title: "Is my data secure?", content: "All uploads are encrypted with SSL/TLS. Videos are automatically deleted after 30 days, and we never share your content."},
]}
/>
</div>
<div id="cta" data-section="cta">
<HeroLogo
logoText="Ready to Transform Your Videos?"
description="Start upscaling with 100 free credits today. No credit card required. Join thousands of creators and professionals already using UpscaleAI to deliver stunning 4K content."
buttons={[
{ text: "Start Free Now", href: "/dashboard" },
{ text: "View Features", href: "#features" },
]}
buttonAnimation="slide-up"
showDimOverlay={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="UpscaleAI"