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
// Otis Kit PRO Examples
import HorizontalTeamCard from "examples/Cards/TeamCards/HorizontalTeamCard";
Emma Roberts
UI Designer
Artist is a term applied to a person who engages in an activity deemed to be an art.
Props Information
Name | Type | Default | Description |
---|---|---|---|
image* | string | Used to set the HorizontalTeamCard image. Its a required prop. | |
name* | string | Used 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* | string | Used to set the HorizontalTeamCard description. Its a required prop. |
Transparent Team Card
// @mui material components
import Tooltip from "@mui/material/Tooltip";
// Otis Kit PRO Components
import MKBox from "components/MKBox";
// Otis Kit PRO Examples
import TransparentTeamCard from "examples/Cards/TeamCards/TransparentTeamCard";
Emma Roberts
CEO / Co-Founder
And I love you like Kanye loves Kanye. We need to restart the human foundation.
Props Information
Name | Type | Default | Description |
---|---|---|---|
image* | string | Used to set the TransparentTeamCard image. Its a required prop. | |
name* | string | Used to set the TransparentTeamCard name. Its a required prop. | |
position* | string | Used to set the TransparentTeamCard job title. Its a required prop. | |
description | string | '' | Used to set the TransparentTeamCard description. Its a required prop. |
socials | node | '' | Used to set the TransparentTeamCard social media icon or something else. |