Testimonials

Centered quote, star-rated quote, and multi-column quote grid.

Preview

“Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo expedita voluptas culpa sapiente alias molestiae. Numquam corrupti in laborum sed rerum et corporis.”

Judith Black
CEO of Workcation

5 out of 5 stars

“Qui dolor enim consectetur do et non ex amet culpa sint in ea non dolore. Enim minim magna anim id minim eu cillum sunt dolore aliquip.”

Judith Black
CEO of Workcation

Testimonials

We have worked with thousands of amazing people

“Laborum quis quam. Dolorum et ut quod quia. Voluptas numquam delectus nihil.”

Leslie Alexander
@lesliealexander

“Quia dolorem qui et. Atque quo aliquid sit eos officia. Dolores similique laboriosam quaerat.”

Michael Foster
@michaelfoster

“Consequatur ut atque. Itaque nostrum molestiae id veniam eos cumque. Ut quia eum fugit laborum autem.”

Dries Vincent
@driesvincent

React preview

LiveView (HEEx) 

alias DesignSystem.UI.Testimonials

<Testimonials.testimonial
  quote="“Workcation changed how our team takes time off.”"
  author_name="Judith Black"
  author_role="CEO of Workcation"
  avatar_src={@user.avatar_url}
/>

<Testimonials.testimonial
  variant="with_rating"
  rating={5}
  quote="“Five stars, would recommend to any team.”"
  author_name="Judith Black"
  author_role="CEO of Workcation"
/>

<Testimonials.testimonial_grid
  title="Loved by teams of every size"
  items={[
    %{quote: "“Best tool I’ve used in years.”", name: "Leslie Alexander", handle: "@lesliealexander", avatar_src: @leslie_url}
  ]}
/>

React (JSX) 

import { Testimonial, TestimonialGrid } from "../ui/index.mjs"

<Testimonial
  quote="“Workcation changed how our team takes time off.”"
  authorName="Judith Black"
  authorRole="CEO of Workcation"
  avatarSrc={user.avatarUrl}
/>

<Testimonial
  variant="with_rating"
  rating={5}
  quote="“Five stars, would recommend to any team.”"
  authorName="Judith Black"
  authorRole="CEO of Workcation"
/>

<TestimonialGrid
  title="Loved by teams of every size"
  items={[
    { quote: "“Best tool I’ve used in years.”", name: "Leslie Alexander", handle: "@lesliealexander", avatarSrc: leslieUrl }
  ]}
/>