Testimonial
Displays customer quotes and reviews.
If it doesn’t make you a little nervous, it’s probably not growth.
---
import Testimonial from "@core-elements/testimonial/Testimonial.astro";
---
<Testimonial alignX="start" authorDescription="Travel photographer" authorImage="/src/assets/images/component-library/profile.jpg" authorName="Jules Mercer">
If it doesn’t make you a little nervous, it’s probably not growth.
</Testimonial> ---
blocks:
- _component: building-blocks/core-elements/testimonial
text: If it doesn’t make you a little nervous, it’s probably not growth.
authorName: Jules Mercer
authorDescription: Travel photographer
authorImage: /src/assets/images/component-library/profile.jpg
alignX: start
--- Overview
A component for showcasing customer quotes and reviews. Includes optional author name, role, and avatar. Ideal for social proof sections, testimonials, and case studies.
Properties
text string | default: My testimonial text.
Quotation marks will be added around the text.
authorName string | default: Charlie Parker
The person to whom you're attributing the quotation.
authorDescription string | default: Author
The role or company of the person.
authorImage string
The image of the author.
alignX enum | default: start
The horizontal alignment of the testimonial.
-
start -
center
Slots
default
The quote.
Used only when the text property is not set.
Examples
AlignX
The impact was immediate. Our workflow feels lighter, and results speak for themselves
---
import Testimonial from "@core-elements/testimonial/Testimonial.astro";
---
<Testimonial alignX="start" authorDescription="Author" authorImage="/src/assets/images/component-library/profile.jpg" authorName="Casey Lin">
The impact was immediate. Our workflow feels lighter, and results speak for themselves
</Testimonial> ---
blocks:
- _component: building-blocks/core-elements/testimonial
text: The impact was immediate. Our workflow feels lighter, and results speak for themselves
authorName: Casey Lin
authorDescription: Author
authorImage: /src/assets/images/component-library/profile.jpg
alignX: start
--- The impact was immediate. Our workflow feels lighter, and results speak for themselves
---
import Testimonial from "@core-elements/testimonial/Testimonial.astro";
---
<Testimonial alignX="center" authorDescription="Author" authorImage="/src/assets/images/component-library/profile.jpg" authorName="Casey Lin">
The impact was immediate. Our workflow feels lighter, and results speak for themselves
</Testimonial> ---
blocks:
- _component: building-blocks/core-elements/testimonial
text: The impact was immediate. Our workflow feels lighter, and results speak for themselves
authorName: Casey Lin
authorDescription: Author
authorImage: /src/assets/images/component-library/profile.jpg
alignX: center
--- Author description
This completely changed how our team works together — smoother, faster, and with way less friction.
---
import Testimonial from "@core-elements/testimonial/Testimonial.astro";
---
<Testimonial alignX="start" authorDescription="VP of Product, TechCompany" authorName="Riley James">
This completely changed how our team works together — smoother, faster, and with way less friction.
</Testimonial> ---
blocks:
- _component: building-blocks/core-elements/testimonial
text: This completely changed how our team works together — smoother, faster, and with way less friction.
authorName: Riley James
authorDescription: VP of Product, TechCompany
alignX: start
---