To restrain elements to a non-interactive container. Child elements can be interacted with.
Card vs Tile
If you need an interactive or navigable container, use a tile component.
Usage
Default
A card must have an heading and a content.
NASA Headquarters
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
Editable example
<Card>
<Heading>NASA Headquarters</Heading>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
</Paragraph>
</Content>
</Card>
Outline
A card can use a different style.
NASA Headquarters
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
Editable example
<Cardvariant="outline">
<Heading>NASA Headquarters</Heading>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
Editable example
<Card>
<Imagesrc={SpaceLandscape}alt="Planet over another one"/>
<Heading>NASA Headquarters</Heading>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
<Imagesrc={Planet}alt="Planet over another one"width="100px"/>
</Illustration>
<Heading>NASA Headquarters</Heading>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
</Paragraph>
</Content>
</Card>
Header
A card can have an header.
NASA Headquarters
No unexpected visitors allowed.
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
Editable example
<Card>
<Heading>NASA Headquarters</Heading>
<Header>No unexpected visitors allowed.</Header>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and formerly named Two Independence Square, is a low-rise office building in the two-building Independence Square complex at 300 E Street SW in Washington, D.C.
Editable example
<Card>
<Heading>NASA Headquarters</Heading>
<Header>No unexpected visitors allowed.</Header>
<Content>
<Paragraph>
NASA Headquarters, officially known as Mary W. Jackson NASA Headquarters or NASA HQ and
formerly named Two Independence Square, is a low-rise office building in the
two-building Independence Square complex at 300 E Street SW in Washington, D.C.
The National Aeronautics and Space Administration is an independent agency of the U.S. federal government responsible for the civilian space program, as well as aeronautics and space research.
We reach for new heights and reveal the unknown for the benefit of humankind
Drive advances in science, technology, aeronautics, and space exploration to enhance knowledge, education, innovation, economic vitality and stewardship of Earth
Editable example
<Card>
<Heading>NASA</Heading>
<Content>
<Paragraph>
The National Aeronautics and Space Administration is an independent agency of the U.S.
federal government responsible for the civilian space program, as well as aeronautics
and space research.
</Paragraph>
<Tabsaria-label="NASA">
<Itemkey="vision">
<Header>Vision</Header>
<Content>
We reach for new heights and reveal the unknown for the benefit of humankind
</Content>
</Item>
<Itemkey="mission">
<Header>Mission</Header>
<Content>
Drive advances in science, technology, aeronautics, and space exploration to
enhance knowledge, education, innovation, economic vitality and stewardship of
