"use client" import Link from "next/link" import { FancyButton } from "@/components/ui/fancy-button" import { Icons } from "@/components/ui/icons" type IntegrationItem = { label: string icon: React.ComponentType> } type IntegrationLayer = { label: string description: string rotation: number integrations: IntegrationItem[] } const layers: IntegrationLayer[] = [ { label: "Create", description: "From a spark to a plan", rotation: -6, integrations: [ { label: "OpenAI", icon: Icons.OpenAI }, { label: "Gemini", icon: Icons.Gemini }, { label: "Anthropic", icon: Icons.Anthropic }, ], }, { label: "Build", description: "Turn your ideas into work", rotation: 0, integrations: [ { label: "Cursor", icon: Icons.Cursor }, { label: "VS Code", icon: Icons.VisualStudioCode }, { label: "React", icon: Icons.React }, ], }, { label: "Ship", description: "Put something great out there", rotation: 6, integrations: [ { label: "GitHub", icon: Icons.GitHub }, { label: "Next.js", icon: Icons.Nextjs }, { label: "v0", icon: Icons.V0 }, ], }, ] export function Integration() { return (

From start to shipped

Every layer.
Working together.

Your workflow has more than one chapter. Connect the tools that help you write each one.

} > Connect every layer

{label}

{description}

) }

{label}