66 lines
2.4 KiB
TypeScript
66 lines
2.4 KiB
TypeScript
import { H2, P } from '@/components/Texts'
|
|
import { Button } from '@/components/Button'
|
|
import { LayoutTextFlip } from '@/components/ui/layout-text-flip' // make sure this import path is correct
|
|
|
|
export function HomeAgent() {
|
|
return (
|
|
<div className="relative isolate overflow-hidden bg-white">
|
|
<div className="px-6 py-24 sm:py-32 lg:px-8">
|
|
<div className="mx-auto max-w-4xl text-center">
|
|
<H2>
|
|
Deploy your own{" "}
|
|
<span className="text-left text-black font-medium text-7xl italic bg-clip-text bg-gradient-to-r from-blue-400 via-cyan-400 to-violet-400">
|
|
<LayoutTextFlip
|
|
text=""
|
|
words={[
|
|
"GPT-5",
|
|
"Claude 3.5",
|
|
"Gemini 1.5",
|
|
"Mistral 7B",
|
|
"Llama 3.1",
|
|
|
|
"AI Agents",
|
|
]}
|
|
/>
|
|
</span>
|
|
</H2>
|
|
|
|
<P className="mx-auto mt-6 max-w-xl text-lg/8 text-pretty text-gray-600">
|
|
Mycelium delivers enterprise-grade AI agents with unmatched customizability and the fastest time to production — all in the agent platform designed for real business use cases.
|
|
</P>
|
|
|
|
<div className="mt-10 flex items-center justify-center gap-x-6">
|
|
<Button variant="solid" color="cyan" href="/signup">
|
|
Get started
|
|
</Button>
|
|
<a href="/agents" className="text-sm/6 font-semibold text-gray-900 hover:text-gray-600">
|
|
Learn more <span aria-hidden="true">→</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<svg
|
|
viewBox="0 0 1024 1024"
|
|
aria-hidden="true"
|
|
className="absolute top-1/2 left-1/2 -z-10 size-256 -translate-x-1/2 mask-[radial-gradient(closest-side,white,transparent)]"
|
|
>
|
|
<circle
|
|
r={512}
|
|
cx={512}
|
|
cy={512}
|
|
fill="url(#8d958450-c69f-4251-94bc-4e091a323369)"
|
|
fillOpacity="0.7"
|
|
/>
|
|
<defs>
|
|
<radialGradient id="8d958450-c69f-4251-94bc-4e091a323369" cx="50%" cy="50%" r="50%">
|
|
<stop offset="0%" stopColor="#60A5FA" /> {/* blue-400 */}
|
|
<stop offset="50%" stopColor="#06B6D4" /> {/* cyan-500 */}
|
|
<stop offset="100%" stopColor="#A78BFA" /> {/* violet-400 */}
|
|
</radialGradient>
|
|
</defs>
|
|
</svg>
|
|
</div>
|
|
)
|
|
}
|