Card
Card is a container for text, photos, and actions.
Import
import { Card } from 'sveltekev';Title
Title
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Size
Title size
Title xs
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Title sm
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Title md
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Title lg
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Title xl
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Radius
Radius none
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Radius sm
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Radius md
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Radius lg
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color
Color black
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color white
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color gray
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color none
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color default
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color primary
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color secondary
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color success
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color warning
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Color danger
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Shadow
Shadow 0
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Shadow 1
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Shadow 2
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Shadow 3
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magnam accusamus dignissimos aspernatur iusto, ad hic maiores saepe.
Content
Just wrap your content.
Dragonite
Dragon/Flaying
API
ATTRIBUTE | TYPE | DEFAULT |
|---|---|---|
title | string | null |
size | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | md |
radius | 'none' | 'sm' | 'md' | 'lg' | 'full' | none |
color | 'black' | 'white' | 'gray' | 'none' | 'default' | 'primary' | 'secondary' | 'success' | 'warning'| 'danger' | default |
shadow | 0 | 1 | 2 | 3 | 0 |