Card
Container component for grouping related content
Preview
Interactive preview of the Card component
Example Card
Card description text
This is the main content of the card.
Usage Guidelines
When to use
- Use card components when you need to display or organize content
- Consider using card for structured content presentation
Best practices
- Maintain consistent styling across similar card components
- Ensure proper labeling and accessibility attributes
- Use appropriate variants for different contexts and purposes
Accessibility
The Card component follows accessibility best practices:
- Uses semantic HTML elements when appropriate
- Supports keyboard navigation
- Includes proper ARIA attributes
- Maintains sufficient color contrast
Used On Pages
The Card component is used on the following pages: