+
+ );
+}
diff --git a/src/components/TeamMarketing/TeamHeroBanner.tsx b/src/components/TeamMarketing/TeamHeroBanner.tsx
new file mode 100644
index 000000000..dbd8921d1
--- /dev/null
+++ b/src/components/TeamMarketing/TeamHeroBanner.tsx
@@ -0,0 +1,65 @@
+import { CheckCircle, CheckCircle2, CheckIcon } from 'lucide-react';
+
+const featureList = [
+ 'Invite your team members',
+ 'Create custom roadmaps for your teams',
+ "Plan, track and document your team's skills and growth",
+ "Get insights on your team's skills and growth",
+];
+
+export function TeamHeroBanner() {
+ return (
+
+
+ See how it works
+Here is a sneak peek of what you can do today (more coming soon!)
+ +
+ {demoItems.map((item, counter) => {
+ const isActive = item === activeItem;
+ const hasAlreadyViewed = hasViewed.includes(counter);
+
+ if (!isActive) {
+ return (
+
+ {
+ setHasViewed([
+ ...hasViewed,
+ counter
+ ])
+ setActiveItem(item);
+ }}
+ className={cn('z-50 cursor-pointer rounded-full p-[6px]', {
+ 'bg-black': item === activeItem,
+ 'bg-gray-300 hover:bg-gray-400': item !== activeItem,
+ })}
+ />
+ {!hasAlreadyViewed && }
+
+ );
+ }
+
+ return (
+
+ {activeItem.title}
+
+ );
+ })}
+
+
+ 
+ )}
+ {!activeItem.image && (
+
+
+
+
+ {activeItem.image && (
+
+
+ )}
+ + Register your team now and help us shape the future of teams in + roadmap.sh! +
+
+
+ Create your Team
+
+
+ or
+
+ Login to your account
+
+
+
+
+
+ );
+}
diff --git a/src/components/TeamMarketing/TeamPricing.tsx b/src/components/TeamMarketing/TeamPricing.tsx
new file mode 100644
index 000000000..5dc8ad33f
--- /dev/null
+++ b/src/components/TeamMarketing/TeamPricing.tsx
@@ -0,0 +1,80 @@
+import { Check, CheckCircle, Copy, Sparkles } from 'lucide-react';
+import { useCopyText } from '../../hooks/use-copy-text.ts';
+import { cn } from '../../lib/classname.ts';
+
+export function TeamPricing() {
+ const { isCopied, copyText } = useCopyText();
+ const teamEmail = 'teams@roadmap.sh';
+
+ return (
+
+
+
+ 
+
+
+
+ + Roadmaps for Teams +
++ Train, plan and track your team's skills and career growth. +
+ +-
+ {featureList.map((feature, index) => (
+
-
+
+ {feature} +
+ ))}
+
+
+
+ );
+}
diff --git a/src/components/TeamMarketing/TeamTools.tsx b/src/components/TeamMarketing/TeamTools.tsx
new file mode 100644
index 000000000..109636f0b
--- /dev/null
+++ b/src/components/TeamMarketing/TeamTools.tsx
@@ -0,0 +1,62 @@
+const toolsList = [
+ {
+ imageUrl: '/images/team-promo/skill-gap.png',
+ title: 'Skill gap analysis',
+ description: 'Understand the skills of your team and identify gaps.',
+ },
+ {
+ imageUrl: '/images/team-promo/growth-plans.png',
+ title: 'Growth plans',
+ description: 'Prepare shared or individual growth plans for members.',
+ },
+ {
+ imageUrl: '/images/team-promo/progress-tracking.png',
+ title: 'Progress tracking',
+ description: 'Track the and compare the progress of team members.',
+ },
+ {
+ imageUrl: '/images/team-promo/team-insights.png',
+ title: 'Team insights',
+ description: 'Get insights about your team skills, progress and more.',
+ },
+ {
+ imageUrl: '/images/team-promo/onboarding.png',
+ title: 'Onboarding',
+ description: 'Prepare onboarding plans for new team members.',
+ },
+ {
+ imageUrl: '/images/team-promo/documentation.png',
+ title: 'Documentation',
+ description: 'Create and share visual team documentations.',
+ },
+];
+
+export function TeamTools() {
+ return (
+
+
+ Beta Pricing
++ We are currently in beta and are offering free access to all features. +
+ +
+
+
+
+
+
+
+ Roles and Permissions
+Custom Roadmaps
+Progress Tracking
+Team Insights
+Onboarding support
+
+ 
+
+
+ + Questions? We are here to help! +
++ +
+
+
+ );
+}
diff --git a/src/pages/teams.astro b/src/pages/teams.astro
new file mode 100644
index 000000000..1c47f99b7
--- /dev/null
+++ b/src/pages/teams.astro
@@ -0,0 +1,14 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import { TeamHeroBanner } from '../components/TeamMarketing/TeamHeroBanner';
+import { TeamTools } from '../components/TeamMarketing/TeamTools';
+import { TeamDemo } from '../components/TeamMarketing/TeamDemo';
+import { TeamPricing } from '../components/TeamMarketing/TeamPricing';
+---
+
+
+
+ Tools to help you excel
++ Skill gap analysis, growth plans, progress tracking, team insights and + more. +
+ +
+ {toolsList.map((tool) => {
+ return (
+
+
+ 
+
+ );
+ })}
+ {tool.title}
+{tool.description}
+