About Us

A layout highlighting company values with numbered accents and alternating typography.

v0

Installation

Full Setup guide

Install the component automatically via Shadcn CLI.

npx shadcn@latest add https://www.grettech.com/api/registry/about-us

Post-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

PropTypeDefaultDescription
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.