Team sections

Compact leadership list and large photo-grid layouts with optional bios and social links.

Preview

Meet our leadership

We’re a dynamic group of individuals who are passionate about what we do and dedicated to delivering the best results for our clients.

  • Leslie Alexander

    Co-Founder / CEO

  • Michael Foster

    Co-Founder / CTO

  • Dries Vincent

    Business Relations

  • Lindsay Walton

    Front-end Developer

Our team

We’re a dynamic group of individuals who are passionate about what we do.

React preview

LiveView (HEEx) 

alias DesignSystem.UI.TeamSections

<TeamSections.team_grid
  variant="small"
  title="Meet our leadership"
  description="The team that ships every release."
  people={[
    %{name: "Leslie Alexander", role: "CEO", image_url: @leslie_avatar}
  ]}
/>

<TeamSections.team_grid
  variant="large"
  title="Our team"
  people={[
    %{
      name: "Lindsay Walton",
      role: "Front-end Developer",
      image_url: @lindsay_photo,
      bio: "Lindsay builds the UI and writes the docs.",
      links: [%{platform: "x", href: "#"}, %{platform: "linkedin", href: "#"}]
    }
  ]}
/>

React (JSX) 

import { TeamSection } from "../ui/index.mjs"

<TeamSection
  variant="small"
  title="Meet our leadership"
  description="The team that ships every release."
  people={[{ name: "Leslie Alexander", role: "CEO", imageUrl: leslieAvatar }]}
/>

<TeamSection
  variant="large"
  title="Our team"
  people={[
    {
      name: "Lindsay Walton",
      role: "Front-end Developer",
      imageUrl: lindsayPhoto,
      bio: "Lindsay builds the UI and writes the docs.",
      links: [{ platform: "x", href: "#" }, { platform: "linkedin", href: "#" }],
    },
  ]}
/>