# EuiCardComponent

**Type:** component



The eui-card component is based on Material Design and provides a content container for text, photos and actions in the context of a single subject.


**Selector:** `eui-card`

## Inputs
- **e2eAttr**: `string` - Sets the `data-e2e` attribute at the host element.
- **euiCollapsed**: `boolean` - Sets the `euiCollapsed` attribute which collapses the card content.
- **euiCollapsible**: `boolean` - Sets the `euiCollapsible` attribute which shows the collapsible toggle in the header.
- **euiHoverable**: `boolean` - Sets the `euiHoverable` attribute in order to show the hover effect on the card.
- **euiNoContentPadding**: `boolean` - Sets the `euiNoContentPadding` attribute in order to remove the padding from the card content.
- **euiNoShadow**: `boolean` - Sets the `euiNoShadow` attribute in order to remove the shadow from the card.
- **euiSelected**: `boolean` - Sets the `euiSelected` attribute in order to show the card header as selected.
- **euiUrgent**: `boolean` - Sets the `euiUrgent` attribute in order to show the card header as urgent.
- **euiPrimary**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSecondary**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiInfo**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSuccess**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiWarning**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiDanger**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiAccent**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiHighlighted**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiDisabled**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiLoading**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeXS**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeS**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeM**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeL**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeXL**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSize2XL**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeVariant**: `any` - From host directive: #[[file:BaseStatesDirective.md]]

## Outputs
- **collapse**: `EventEmitter<boolean>` - Event emitted when the card collapses.
