Creative Tim  |  Docs

Team Cards

The Team Cards components helps you to simply create beautiful cards for displaying your team members details.

The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.

Horizontal Team Card

// Material Kit 2 React Examples import HorizontalTeamCard from "examples/Cards/TeamCards/HorizontalTeamCard";
Emma Roberts
Emma Roberts
UI Designer

Artist is a term applied to a person who engages in an activity deemed to be an art.

Props Information

NameTypeDefaultDescription
image*stringUsed to set the HorizontalTeamCard image. Its a required prop.
name*stringUsed to set the HorizontalTeamCard name. Its a required prop.
position*{ color: [ "primary", "secondary", "info", "success", "warning", "error", "dark", "light", ], label: String, }Used to set the HorizontalTeamCard job title. Its a required prop.
description*stringUsed to set the HorizontalTeamCard description. Its a required prop.

Transparent Team Card

PRO
// @mui material components import Tooltip from "@mui/material/Tooltip"; // Material Kit 2 PRO React Components import MKBox from "components/MKBox"; // Material Kit 2 PRO React Examples import TransparentTeamCard from "examples/Cards/TeamCards/TransparentTeamCard";
Emma Roberts
Emma Roberts

CEO / Co-Founder

And I love you like Kanye loves Kanye. We need to restart the human foundation.

Props Information

NameTypeDefaultDescription
image*stringUsed to set the TransparentTeamCard image. Its a required prop.
name*stringUsed to set the TransparentTeamCard name. Its a required prop.
position*stringUsed to set the TransparentTeamCard job title. Its a required prop.
descriptionstring''Used to set the TransparentTeamCard description. Its a required prop.
socialsnode''Used to set the TransparentTeamCard social media icon or something else.
Contents