Docs
Installation
A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its dependencies and any missing npm packages, and installs them straight into your project.
npx shadcn add https://staaarter.com/r/institutional-quick-facts.jsonPrefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/education/education2.tsx instead.
Usage
The file also exports education2Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.
import { Education2, education2Demo } from "@/components/blocks/education/education2"; export default function Page() { return <Education2 {...education2Demo} />; }
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | string | none | Small uppercase label above the heading; only rendered when set. |
| heading | ReactNode | none | Section heading, centered above the facts grid. |
| description | string | undefined | Centered intro text below the heading. |
| facts | FactItem[] | none | Fact tiles rendered in a fixed 4-column grid with hairline dividers between them. |
| className | string | none | Extra classes for the outer section element. |
Types
type FactItem = { value: string; label: string; description?: string; };
Behavior notes
- facts always renders in a fixed 2-column grid on mobile and 4-column grid on desktop; more than 4 items will wrap to additional rows rather than reflowing column count.
- Hairline dividers between tiles come from a 1px background-color grid gap, not individual borders, so they stay crisp regardless of theme.
- Each fact's description is optional and independent; a tile with only a value and label still sits flush against its neighbors.
- This is a static display grid; no value updates or fetches live data.
More Education Blocks
View all →Academy Course Cards
Academy section with an eyebrow, a two-column heading, and three course cards that float a lesson checklist above a category label, title, and lesson count.
Global Partnerships Grid
Global partnerships section showcasing partner institutions with location details and yearly exchange statistics.
Mission and Vision Statement
Side-by-side mission and vision text blocks with an inspirational leadership quote below.
Social Media Links Grid
Social media connection section with platform cards showing handle and follower count.
Education Social Proof
Social proof section pairing key stats (rating, enrollment, completion rate) with a featured student testimonial.
Faculty Testimonials Grid
Grid of faculty testimonials with instructor photos, teaching-philosophy quotes, and years of experience.