Card

Nuxt UI Pro
Docus
Source

Usage

Card Title

Description

Beautifully designed Nuxt Content template with shadcn-vue. Customizable. Compatible. Open Source.
Footer 
::card
---
icon: lucide:box
---

#title
Card Title

#description
Description

#content
Beautifully designed **Nuxt Content** template with **shadcn-vue**. _Customizable. Compatible. Open Source._

#footer
Footer
::

Link

::card
---
to: https://github.com/ZTL-UwU/shadcn-docs-nuxt
target: _blank
# showLinkIcon: false
---

#title
Link Card

#content
Beautifully designed **Nuxt Content** template with **shadcn-vue**. _Customizable. Compatible. Open Source._
::

Horizontal

Horizontal Card

Beautifully designed Nuxt Content template with shadcn-vue. Customizable. Compatible. Open Source. 

::card
---
icon: 'lucide:fold-horizontal'
icon-size: 26
horizontal: true
---

#title
Horizontal Card

#description
Beautifully designed **Nuxt Content** template with **shadcn-vue**. _Customizable. Compatible. Open Source._
::

Image

Image Card

Beautifully designed Nuxt Content template with shadcn-vue. Customizable. Compatible. Open Source.
::card
---
img: /og-nuxt.png
---
#title
Image Card

#content
Beautifully designed **Nuxt Content** template with **shadcn-vue**. _Customizable. Compatible. Open Source._
::

Props

titlestring
Card title
descriptionstring
Card description
contentstring
Card content
footerstring
Card footer
iconstring
Card icon
horizontalboolean
false
tostring
Link URL
targetTarget
A target attribute value to apply on the link
iconSizenumber
24
imgstring
Image URL
showLinkIconboolean
true
Whether to show the link indicator
Edit this page
Callout
Card Group