Skip to content

Card

Props

API reference for Card. For usage examples, see the React tab.

Card.Root

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
outlinedbooleanfalse

Include an outline on the card

partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
vocabstring

Card.Actions

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
vocabstring

Card.Body

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
vocabstring

Card.Content

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
vocabstring

Card.Media

NameTypeDefault
alt (required)string
src (required)string
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
crossOriginCrossOrigin
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
decoding"async" | "auto" | "sync"
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

fetchPriority"auto" | "high" | "low"
heightstring | number
inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
loading"eager" | "lazy"
partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
referrerPolicyHTMLAttributeReferrerPolicy
relstring
resourcestring
resultsnumber
revstring
securitystring
sizesstring
srcSetstring
titlestring
typeofstring
unselectable"off" | "on"
useMapstring
vocabstring
widthstring | number

Card.Subtitle

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
vocabstring

Card.Title

NameTypeDefault
aboutstring
accessKeystring
autoSavestring
childrenReactNode
colorstring
contentstring
contextMenustring
dangerouslySetInnerHTML{ __html: string | TrustedHTML; }
datatypestring
defaultCheckedboolean
exportpartsstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts (opens in new tab)

inlistany
inputMode"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"

Hints at the type of data that might be entered by the user while editing the element or its contents

See: https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute (opens in new tab)

itemIDstring
itemPropstring
itemRefstring
itemScopeboolean
itemTypestring
levelnumber3

The heading level.

partstring

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part (opens in new tab)

prefixstring
propertystring
radioGroupstring
relstring
resourcestring
resultsnumber
revstring
securitystring
titlestring
typeofstring
unselectable"off" | "on"
variant"headline1" | "headline2" | "headline3" | "headline4" | "overline1" | "overline2" | "overline3" | "subtitle1" | "subtitle2" | "subtitle3" | null
vocabstring