Card
A card to link your content with other pages.
Usage
Use the title and icon props to display a card component in your content, the description will be displayed in the default slot with full markdown support.
Components
Discover all the components available in Nuxt UI Pro.
::card{title="Components" icon="i-heroicons-cube-transparent"}
Discover all the components available in **Nuxt UI Pro**.
::
Color
You can use the color prop to change the color of the card:
Components
Discover all the components available in Nuxt UI Pro.
::card{title="Components" icon="i-heroicons-cube-transparent" color="red"}
Discover all the components available in **Nuxt UI Pro**.
::
Link
You can add a to prop to make it a link, an external icon will be displayed when the link is external:
::card
---
title: Components
icon: i-heroicons-cube
to: https://nuxt.com/docs/api/components/client-only
target: _blank
---
Explore Nuxt built-in components for pages, layouts, head, and more.
::
Props
icon
string
undefinedcolor
string
"primary"to
string
undefinedtarget
string
undefinedui
{}
{}