# Testimonials sections > Customer quotes as a single statement, rotating carousels, card grids, glass portraits, case-study panels and photo splits, on the page or the brand colour. URL: https://apogee.avaui.dev/docs/testimonials-sections Last updated: 2026-10-20 Customer quotes as a single statement, rotating carousels, card grids, glass portraits, case-study panels and photo splits, on the page or the brand colour. Last updated October 20, 2026 Each example is a block: a [Section](https://apogee.avaui.dev/docs/section) with quotes marked up as a `
` holding a `
` and a `
` for the person. Rotating quotes use [Carousel](https://apogee.avaui.dev/docs/carousel) (swipe, arrows or dots; without JS they scroll), star ratings use [Rating](https://apogee.avaui.dev/docs/rating), and the logo tabs use [Tabs](https://apogee.avaui.dev/docs/tabs). The people and quotes are invented; replace them with your customers’ own words. ```sh npx @ava-ui/apogee add testimonials/simple-centered-01 ``` ## Copy is props Every block in this family takes the same content props (`TestimonialsContent` in `sections/_shared/testimonials.ts`), with its sample copy as the defaults. A block ignores the props it has no place for, so you can swap one block for another and keep the copy. The [Testimonials](https://apogee.avaui.dev/docs/sections/testimonials) section takes the same names for the props they share. - `eyebrow`: The small label above the heading. - `heading`: The heading. - `description`: The line under the heading. - `label`: Accessible name for the quote carousel or tabs. - `items`: Quotes. Single-quote blocks show the first. - `primaryAction`: The solid button beside the heading. - `secondaryAction`: The outline button beside the heading. - Pass `null` to hide an optional part, such as `description={null}`. - Some blocks add props of their own; the top of each block’s file lists them. [ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__card.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__card.dark.webp) CardOne quote in a grey card, with the person under it. ](https://apogee.avaui.dev/docs/testimonials-sections/card)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-brand.dark.webp) Card brandOne quote in a brand-colour card, with the person under it. ](https://apogee.avaui.dev/docs/testimonials-sections/card-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-left-aligned.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-left-aligned.dark.webp) Simple left alignedA square photo of the person beside a rated quote. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-left-aligned)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-left-aligned-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-left-aligned-brand.dark.webp) Simple left aligned brandA square photo of the person beside a rated quote on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-left-aligned-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-01.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-01.dark.webp) Simple centered 01Three rotating quotes with the person and stars, and dots to switch. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-01)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-01-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-01-brand.dark.webp) Simple centered 01brandThree rotating quotes with the person and stars, and dots to switch on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-01-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-02.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-02.dark.webp) Simple centered 02A company logo over a large quote and the person. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-02)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-02-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-02-brand.dark.webp) Simple centered 02brandA company logo over a large quote and the person on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-02-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-03.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-03.dark.webp) Simple centered 03Quotes from five companies, switched by tabs that show each company. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-03)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-03-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__simple-centered-03-brand.dark.webp) Simple centered 03brandQuotes from five companies, switched by tabs that show each company on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/simple-centered-03-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-01.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-01.dark.webp) Social cards 01Four quote cards with the person, a verified mark and their company. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-01)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-01-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-01-brand.dark.webp) Social cards 01brandFour quote cards with the person, a verified mark and their company on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-01-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-02.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-02.dark.webp) Social cards 02Six rated quote cards with each person and their handle. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-02)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-02-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-02-brand.dark.webp) Social cards 02brandSix rated quote cards with each person and their handle on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-02-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-03.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-03.dark.webp) Social cards 03Nine quote cards in staggered columns that fade out at the bottom. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-03)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-03-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__social-cards-03-brand.dark.webp) Social cards 03brandNine quote cards in staggered columns that fade out at the bottom on the brand colour. ](https://apogee.avaui.dev/docs/testimonials-sections/social-cards-03-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__case-study-cards.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__case-study-cards.dark.webp) Case study cardsA heading with actions over a scrolling row of coloured case-study panels. ](https://apogee.avaui.dev/docs/testimonials-sections/case-study-cards)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-01.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-01.dark.webp) Glassmorphic cards 01A heading with actions over a scrolling row of portraits with inset glass panels. ](https://apogee.avaui.dev/docs/testimonials-sections/glassmorphic-cards-01)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-02.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-02.dark.webp) Glassmorphic cards 02A heading with actions over a scrolling row of portraits with flush glass panels. ](https://apogee.avaui.dev/docs/testimonials-sections/glassmorphic-cards-02)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-03.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__glassmorphic-cards-03.dark.webp) Glassmorphic cards 03A heading with actions over six portraits with glass panels, and a load-more button on phones. ](https://apogee.avaui.dev/docs/testimonials-sections/glassmorphic-cards-03)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-split-image.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-split-image.dark.webp) Card split imageRotating quotes in a grey card beside a video of the customer. ](https://apogee.avaui.dev/docs/testimonials-sections/card-split-image)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-split-image-brand.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__card-split-image-brand.dark.webp) Card split image brandRotating quotes in a brand-colour card beside a video of the customer. ](https://apogee.avaui.dev/docs/testimonials-sections/card-split-image-brand)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-01.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-01.dark.webp) Split image 01Rotating quotes beside a photo of each person with a glass name card. ](https://apogee.avaui.dev/docs/testimonials-sections/split-image-01)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-02.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-02.dark.webp) Split image 02Rotating rated quotes beside a photo of each person with a flush glass strip. ](https://apogee.avaui.dev/docs/testimonials-sections/split-image-02)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-03.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__split-image-03.dark.webp) Split image 03Rotating rated quotes with each person, beside one photo. ](https://apogee.avaui.dev/docs/testimonials-sections/split-image-03)[ ![](https://apogee.avaui.dev/thumbs/testimonials-sections__abstract-image.light.webp)![](https://apogee.avaui.dev/thumbs/testimonials-sections__abstract-image.dark.webp) Abstract imageRotating rated quotes beside a collage of five customer photos. ](https://apogee.avaui.dev/docs/testimonials-sections/abstract-image) ## Related [ TestimonialsOne featured quote, or a grid of quote cards. ](https://apogee.avaui.dev/docs/sections/testimonials)[ CarouselA horizontal scroll-snap track for browsing slides. Native scroll and swipe work with zero JS; arrows, dots, and autoplay are progressive enhancement. ](https://apogee.avaui.dev/docs/carousel)[ RatingA star rating on native radios — pick a value on a scale, or display one read-only. ](https://apogee.avaui.dev/docs/rating)