Skip to content

Card

Default use:


Hello Card
vue
<h-card>Hello Card</h-card>

Variants:


default

outlined
vue
<h-card variant="default">default</h-card>

<h-card variant="outlined">outlined</h-card>

Colors:


default

success

info

danger

warn

primary

secondary

vue
<h-card color="default">default</h-card>

<h-card color="success">success</h-card>

<h-card color="info">info</h-card>

<h-card color="danger">danger</h-card>

<h-card color="warn">warn</h-card>

<h-card color="primary">primary</h-card>

<h-card color="secondary">secondary</h-card>

Shadows:


low

medium

high
vue
<h-card elevation="low">low</h-card>

<h-card elevation="medium">medium</h-card>

<h-card elevation="high">high</h-card>

Tags:


div



article
vue
<h-card tag="div">div</h-card>

<h-card tag="button">button</h-card>

<h-card tag="article">article</h-card>