Sponsors
Become a sponsorBackers
- @kiran, backer
- @sofia.dev, backer
- @tomasz, backer
- @noor, backer
- @amaru, backer
- @lin, backer
- @ezra, backer
- @bea, backer
<SponsorWall variant="minimal" />Clean surfaces and measured motion.
Installation
Use the shadcn CLI to copy the component source and its dependencies into your own project. Installs motion, plus the Ovio theme, world, motion, toy items.
npx shadcn add JanaSundar/ovio/sponsor-wall↳You own the source. Ovio components arrive in your codebase so you can edit any part of their style, behavior, or data flow.
Usage
Set the visual world on the component, or wrap the page in an OvioProvider to set a default for everything inside it.
TSXvariant="minimal"
import { SponsorWall } from "@/components/ovio/sponsor-wall/sponsor-wall"
<SponsorWall
variant="minimal"
sponsors={sponsors}
ctaHref="https://github.com/sponsors/ada-dev"
/>Built with: CSS · Motion for React (layout)
Motion in Minimal: Small springs, opacity and layout shifts that show state.
Props
Control the data, selected world, animation behavior, and callbacks.
| Prop | Type | Description |
|---|---|---|
| sponsors | { name; tier: "platinum" | "gold" | "backer"; url? }[] | Tier decides size; url makes the name a link. |
| variant | | "minimal" | "craft" | "retro" | "toy" | Which world to render. Defaults to the nearest OvioProvider, then minimal. |
| ctaHref | string | Become-a-sponsor link. Hidden when left out. |
| ctaLabel | string | Link text. Default "Become a sponsor". |
| className | string | Merged onto the root. |