About Us
A layout highlighting company values with numbered accents and alternating typography.
Installation
Full Setup guideInstall the component automatically via Shadcn CLI.
npx shadcn@latest add https://www.grettech.com/api/registry/about-usPost-Installation Manual Steps
After running the CLI command, you will need to complete the following manual steps:
Add animations to your CSS
Add the spin animation as @utility spin and keyframes as @keyframes spin inside your globals.css file:
@utility spin {
animation: spin 5s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | - | Optional CSS classes to apply. |
...props | React.HTMLAttributes<HTMLDivElement> | - | Accepts all standard HTML div attributes (id, style, etc). |
title | string | "About Us" | Section title. |
subtitle | string | "We craft modern websites and mobile apps that help businesses thrive in the digital age." | Section subtitle. |
mission | string | "We aim to empower..." | Mission statement text. |
vision | string | "To be the leading catalyst..." | Vision statement text. |
valuesTitle | string | "Our Core Values" | Title for the values grid. |
valuesSubtitle | string | "What drives us forward" | Subtitle for the values grid. |
values* | AboutValueItem[] | - | Array of core value items. |