Retro About Card
A small "about the author" sidebar card. Avatar slot, title, tagline, link list, optional divider, and a mono-numeric meta footer. Ships retro / surface / ghost variants — the retro variant keeps the terminal feel of the source while the other two fit non-retro sites.
Preview
Customize
Variant
retro
Size
md
Slots
Props
| Prop | Type | Default | Description |
|---|---|---|---|
title | ReactNode | required | Display name / handle. |
tagline | ReactNode | — | Optional one-line bio. |
avatar | ReactNode | derived monogram | Avatar slot. Falls back to a two-letter monogram from title. |
links | RetroAboutCardLink[] | — | List of { label, href? } rows. |
meta | ReactNode | — | Footer slot below the divider (mono-numeric, tabular). |
showDivider | boolean | true on retro, false otherwise | Toggle the rule between links and meta. |
variant | "retro" | "surface" | "ghost" | "retro" | Surface treatment. |
size | "sm" | "md" | "lg" | "md" | Padding scale and base type size. |
Accessibility
The card renders as an <aside aria-label="About the author"> so screen-reader users can skip the block as a unit. Each link with an href is a real <a> with a :focus-visible accent ring. The avatar is aria-hidden and the meta footer uses tabular numerals. Avatar hover scale collapses under prefers-reduced-motion.