Bento Grid

A cool grid layout with different child component.

通过 CLI 安装

npm

pnpm

bun

yarn

npx shadcn-vue@latest add "https://registry.inspira-ui.com/bento-grid.json"

在同一个文件中，复制并粘贴以下代码：

BentoGrid.vue

BentoGridCard.vue

BentoGridItem.vue

BentoGrid in MagicUI style.

Slot Name	描述
`title`	Component to show as title.
`description`	Component to show as description.
`icon`	Component to show as icon.
`header`	Component to show as header.

Slot Name	描述
`background`	Component to show in background.

Props Name	类型	描述
`name`	`string`	Name or title to show on card.
`icon`	`?string`	Icon component to show on card.
`description`	`string`	Description content to show on card.
`href`	`string`	Link to the url for CTA.
`cta`	`string`	Text to show on CTA.

本页