Morphing Tabs

This is a morphing tabs interaction, recreated by Preet's work and featuring the gooey effect component.

通过 CLI 安装

npm

pnpm

bun

yarn

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

复制并粘贴以下代码：

MorphingTabs.vue

Prop 名称	类型	默认值	描述
`class`	`string`	`""`	Additional class names to style the component.
`tabs`	`string[]`	`[]`	Tabs.
`activeTab`	`string`	`""`	Current active Tab.
`margin`	`number`	`20`	Active tab margin left and right.
`blurStdDeviation`	`number`	`6`	Svg blur stdDeviation, tab rounded use it.

本页