NexaCore
Light enterprise-infrastructure landing page: a floating pill navbar that shrinks on scroll, a full-screen video hero, a dark service-card grid that unfolds on hover, a chaos-versus-control split around a circular streaming video, and a four-pillar delivery staircase. Self-contained navy-and-lavender palette with multi-stop brand gradients, driven by lucide-react.
Preview
Installation
npx shadcn@latest add https://hirael.com/r/nexacore.jsonCode
components/templates/nexacore/nexacore.tsx
import { cn } from '@/lib/utils';
import { jakarta } from './fonts';
import { Freedom } from './freedom';
import { Hero } from './hero';
import { Navbar } from './navbar';
import { NexacoreStyles } from './styles';
import { Precision } from './precision';
import { Trusted } from './trusted';
const Nexacore = () => {
return (
<div
className={cn('nexacore', jakarta.variable, 'relative min-h-svh bg-background text-foreground antialiased')}
style={{
fontFamily: 'var(--font-nexacore-sans), ui-sans-serif, system-ui, sans-serif',
}}
>
<NexacoreStyles />
<main>
<Navbar />
<Hero />
<Trusted />
<Freedom />
<Precision />
</main>
</div>
);
};
export default Nexacore;
Dependencies
shadcn registry
badgebutton
npm
lucide-react