Ramp

Hero - Centered

Centered hero section with large title, subtitle, and two CTA buttons

Preview

Welcome to Ramp

Modern design system — pick three hues, get an entire OKLCH-based design language

Get StartedLearn More

Code

<SectionBlock
  padding="xl"
  alignment="center"
  titleSize="xl"
  title="Welcome to Ramp"
  subtitle="Modern design system — pick three hues, get an entire OKLCH-based design language"
  cta1={{ text: "Get Started", variant: "default", href: "/signup" }}
  cta2={{ text: "Learn More", variant: "outline", href: "/docs" }}
/>

Usage Notes

  • Import the SectionBlock component from @/components/ui/section-block
  • Customize props to match your design requirements
  • Use the children prop to add custom content
  • All variants support responsive design out of the box