Skip to Main Content
Mosaic
  • Use in projects
  • Home
  • Browse components
    • Colors
    • Themes
    • Icons
    • Grid
    • Links
    • Typography
    • Spacing Utilities
    • SVG
    • Accordions
    • Alerts
    • Badges
    • Breadcrumb
    • Buttons
    • Copy to clipboard
    • Cards
    • Featured Container
    • Filter Bar
    • Lists
    • Loading Spinners
    • Modals
    • Pagination
    • Progress Bars
    • Progress Indicator
    • Site Banner
    • Tables
    • Tabs
    • Toast
    • Toggle Switches
    • Well
    • Wizard
    • Events
    • File Browser
    • File Upload
    • Footer
    • Header
    • Hero
    • Post Item
    • Profile
    • Sidebar Navigation
    • Splash
    • Stack
    • Form Instructions
    • Form Layout
    • Form Validation
    • Form Output
    • Checkboxes
    • Labels
    • Radio Buttons
    • Search Input
    • Select
    • Text Inputs

Profile

Definition

The Profile component is a modular, reusable UI card for displaying summarized information about a person in an application and lists. It is not intended to show all available information on a person (for which a profile page would be more suitable). There are two variations:

  • Profile with description—an image with a name, other optional information, and description.
  • Profile without description—an image with a name and subtitle (typically job position).

Description

Profiles should be used to create a list of people, typically on a team or board.

Profile with description max width is 6 columns. Profiles with no description can be four to a row on xl screens (see example for bootstrap responsive utility classes).

Profiles max-width is 40rem. There is a container query on the inline-size to switch from side-by-side to stacked design for profiles with description, based on 30rem.

There is a fallback user icon for Profiles without an image.

Examples

Profile with Description

J. Trent Alexander
Associate Director and Research Professor
Administration
jtalex@umich.edu

J. Trent Alexander is the Associate Director of ICPSR and the Jerome M. Clubb Collegiate Research Professor in the Institute for Social Research at the University of Michigan. Alexander is a historical demographer and builds social science data infrastructure. He is currently leading the Decennial Census Digitization and Linkage Project (joint with Katie Genadek) and ResearchDataGov (joint with Lynette Hoelter). These projects are supported by awards from the National Science Foundation, the National Institute on Aging, the U.S. Census Bureau, the Bill and Melinda Gates Foundation, the Ballmer Group, and the University of Michigan’s Office of the Vice President for Research. Prior to coming to ICPSR in 2017, Alexander initiated the Census Longitudinal Infrastructure Project at the Census Bureau and managed the Integrated Public Use Microdata Series (IPUMS) at the University of Minnesota.

Joe Saul
Privacy and Security Officer
Administration
jmsaul@umich.edu

Joe Saul is ICPSR’s Privacy and Security Officer; he leads data protection at ICPSR, including managing contracts for access to restricted data, FISMA security standards compliance, contingency planning, and incident response. He comes to ICPSR with nearly 30 years of public and private-sector data protection experience, including working on HIPAA implementation at Michigan Medicine and serving as CSO of a health data analytics company. Joe chairs ICPSR’s Disclosure Review Board and Restricted Data Dissemination and Access Committee, as well as leading ICPSR’s Privacy and Security Team.

Joe has a J.D. from the University of Michigan Law School, as well as a B.S. in Cellular and Molecular Biology from the University of Michigan and professional certifications in information security and privacy.

Maggie C. Levenstein
Director
Administration
maggiel@umich.edu
734-555-1234

OrcID

Google Scholar

ResearchGate

External bio

Margaret Levenstein is Director of ICPSR, the Inter-university Consortium for Political and Social Research. Founded in 1962, ICPSR is the largest curated social science data archive in the world and a recipient of a 2019 National Medal for Museum and Library Service.

Margaret Levenstein is Professor in the School of Information, Research Professor in the Institute for Social Research, and Adjunct Professor of Business Economics, University of Michigan. She is Principal Investigator of the NSF infrastructure project, Research Data Ecosystem and Co-Director of the Michigan Federal Statistical Research Data Center. She serves on boards of Social Science Research Council; World Data System; Data Documentation Initiative (DDI); National Internet Observatory; NOAA's Data Archiving and Access Requirements Working Group (DAARWG); Criminal Justice Administrative Records System; and Wealth and Mobility Study. She received her PhD from Yale University and BA from Barnard College, Columbia University. She is a fellow of the National Association for the Advancement of Science. She is author of Accounting for Growth: Information Systems and the Creation of the Large Corporation. Formerly president of the Business History Conference, she is the author of numerous historical and contemporary studies of competition and of innovation as well as the production, dissemination, and confidentiality protection of data for social and economic measurement.


<div class="profile">
  <div class="profile-info">
    <div class="profile-image">
      <img
        class="img-fluid"
        src="https://wpvip.icpsr.umich.edu/icpsr/wp-content/uploads/sites/11/2025/03/ML-HeadShot2025sq.jpg"
        alt="" />
    </div>
    <div class="profile-text">
      <div class="profile-name">Maggie C. Levenstein</div>
      <div class="profile-title">Director</div>
      <div class="profile-department">Administration</div>
      <div class="profile-email">
        <a href="mailto:maggiel@umich.edu">maggiel@umich.edu</a>
      </div>
      <div class="profile-phone">734-555-1234</div>
      <div class="profile-cv"><a href="#">CV (PDF)</a></div>
      <div class="profile-profiles">
        <div class="wp-content clearfix">
          <p><a href="#">OrcID</a></p>
          <p><a href="#">Google Scholar</a></p>
          <p><a href="#">ResearchGate</a></p>
        </div>
      </div>
      <div class="profile-bio-url"><a href="#">External bio</a></div>
    </div>
  </div>
  <div class="profile-biography">
    <div class="wp-content">
      <p>
        Margaret Levenstein is Director of ICPSR, the Inter-university
        Consortium for Political and Social Research. Founded in 1962, ICPSR is
        the largest curated social science data archive in the world and a
        recipient of a 2019 National Medal for Museum and Library Service.
      </p>
      <p>
        Margaret Levenstein is Professor in the School of Information, Research
        Professor in the Institute for Social Research, and Adjunct Professor of
        Business Economics, University of Michigan. She is Principal
        Investigator of the NSF infrastructure project, Research Data Ecosystem
        and Co-Director of the Michigan Federal Statistical Research Data
        Center. She serves on boards of Social Science Research Council; World
        Data System; Data Documentation Initiative (DDI); National Internet
        Observatory; NOAA's Data Archiving and Access Requirements Working Group
        (DAARWG); Criminal Justice Administrative Records System; and Wealth and
        Mobility Study. She received her PhD from Yale University and BA from
        Barnard College, Columbia University. She is a fellow of the National
        Association for the Advancement of Science. She is author of Accounting
        for Growth: Information Systems and the Creation of the Large
        Corporation. Formerly president of the Business History Conference, she
        is the author of numerous historical and contemporary studies of
        competition and of innovation as well as the production, dissemination,
        and confidentiality protection of data for social and economic
        measurement.
      </p>
    </div>
  </div>
</div>

Profile Basic

Sandra Marquart-Pyatt
ICPSR Governance Council
Michael Steelworthy
Cawthorne
Heather Thompson
Luke Hyde
Joseph Kahne

<div class="profile">
  <div class="profile-info">
    <div class="profile-image" style="background-image: url('https://wpvip.icpsr.umich.edu/icpsr/wp-content/uploads/sites/11/2025/03/ML-HeadShot2025sq.jpg?')">
    </div>
    <div class="profile-text">
      <div class="profile-name">Sandra Marquart-Pyatt</div>
      <div class="profile-title">ICPSR Governance Council</div>
    </div>
  </div>
</div>
<div class="profile-biography">
  <!-- assuming this is coming from wp; otherwise, you don't have to manually create this .wp-content container -->
  <div class="wp-content clearfix"> 
    <p>
      Joseph Kahne, Ph.D. is the Ted and Jo Dutton Presidential Chair for
      Education Policy and Politics at the University of California, Riverside and
      Chair of the MacArthur Foundation Research Network on Youth and
      Participatory Politics. Joe's current research draws on a national
      longitudinal survey of youth (conducted in partnership with Cathy Cohen at
      the University of Chicago) to examine ways participation with digital media
      is shaping youth civic and political engagement. He also studies ways that
      educational efforts can improve the quantity, quality, and equality of youth
      civic and political engagement. A former high school social studies teacher,
      Joe is Co-Principal Investigator (with Erica Hodgin) of Educating for
      Democracy in the Digital Age—A district-wide effort in Oakland California to
      provide all youth with rich and equitable opportunities to work for change
      in their communities. He sits on the steering committee of the National
      Campaign for the Civic Mission of Schools, on the iCivics Research Advisory
      Board, on the advisory board of CIRCLE (the Center for Information and
      Research on Civic Learning), and he is a Senior Advisor to the Spencer
      Foundation's New Civics Initiative.
    </p>
  </div>
</div>

Variables

--profile-image-margin: #{$spacer-sm}; // 0.5rem
  • facebook

  • Instagram

  • Twitter

  • LinkedIn

  • YouTube

  • Accessibility
  • Privacy Policy
  • Contact Us
Sign up for our newsletter
ICPSR

© 2025 The Regents of the University of Michigan. ICPSR is part of the Institute for Social Research at the University of Michigan.