Components
Loading preview...
This AboutPage component is a fully responsive, visually engaging section designed to highlight a company’s ecosystem, achievements, and core offerings. The top hero section features a large, rounded hero image with a bold headline and supporting text, emphasizing the company’s ecosystem and its products, models, and platforms. Below it, the About section introduces the team and mission, followed by a three-column layout: a large main image on the left and two vertically stacked cards on the right. The first card showcases detailed content with a dark background, a top image with a gradient fade, a descriptive headline, explanatory text, and a call-to-action button. The second card complements it with a colorful image and a brief text overlay. Both cards scale up slightly on hover, adding interactivity, while gradient overlays ensure readability. The layout is fully responsive, adapting to smaller screens by stacking the cards vertically, and it supports dark and light themes, maintaining contrast and visual clarity across modes. Overall, it balances aesthetics, interactivity, and information hierarchy to create a modern “About Us” page that engages users and communicates value effectively.
npx shadcn@latest add https://21st.dev/r/ruixen.ui/about-pageimport AboutPage from "@/components/ui/about-page"
export default function DemoPage() {
return (
<div className="min-h-screen bg-background text-foreground">
<AboutPage />
</div>
)
}