---
title: "Testimonial Quotes — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Aidan Looker · Carousels. What is Testimonial Quotes?"
canonical: "https://framer.elliotli.dev/component/testimonial-quotes"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Testimonial Quotes

# Testimonial Quotes

Star-rated quotes with gradient keywords

[View on Framer](https://framer.com/marketplace/components/testimonial-quotes/?via=elliot-li)

![Testimonial Quotes preview image 1](https://framer.elliotli.dev/og/component/testimonial-quotes/8705437380da9994/1600x1200.jpg)

## Summary

What is Testimonial Quotes?

## Description

## What is Testimonial Quotes?

Testimonial Quotes is a polished social proof component that displays large, centered quotes with gradient-highlighted keywords, fractional star ratings, and an interactive avatar row for cycling between testimonials. Each quote transitions with a smooth blur-and-slide animation, while a subtle wave hover effect lifts individual characters as the cursor passes over the text. Fully responsive and ideal for SaaS landing pages, agency portfolios, product pages, and startup sites that need testimonials to feel dynamic rather than static.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

## Core Features

-   Gradient keyword highlighting using a simple **double asterisk** syntax — wrap any word to apply a flowing gradient
    
-   Fractional star ratings per testimonial — supports precise values like 4.35, with theme-matched colors that adapt automatically
    
-   Interactive avatar selector with gradient ring, glow effects, hover tooltips, and smooth spring animations
    
-   Per-character wave hover animation that subtly lifts letters near the cursor for a premium, tactile feel
    
-   Four curated theme presets (Pearl, Obsidian, Midnight, Ember) plus a fully custom colour mode
    
-   Fully responsive layout
    
-   Optional auto-play with configurable interval and automatic pause-on-hover
    

## Controls inside Framer

### Content

-   Testimonials — add up to 12 quotes with name, role, rating value, and gradient keyword markup
    
-   Avatars — upload custom avatar images per testimonial, or use built-in defaults
    
-   Avatar Size — adjust from 40px to 96px
    

### Star Rating

-   Star Rating — show or hide the star display
    
-   Star Size — adjust from 12px to 32px
    
-   Star Color — automatically matched to each theme preset, or set manually in Custom mode
    

### Playback

-   Auto Play — toggle automatic cycling with a 2–15 second interval
    
-   Pause on hover — auto-play pauses when the user interacts
    

### Theme

-   Theme — choose Pearl, Obsidian, Midnight, Ember, or Custom
    
-   Custom Colors — background, primary text, secondary text, gradient start, gradient end, quote mark colour, star colour
    

### Quote Style

-   Font Size — 18px to 48px
    
-   Line Height — fine-tune from 1.1 to 2.0
    
-   Quote Marks — toggle decorative marks on or off, with adjustable size
    

### Animation

-   Transition Speed — Slow, Medium, or Fast
    
-   Avatar Hover Scale — control the hover magnification of inactive avatars
    

### Typography

-   Font — connect any Framer font with weight control
    

## Best use cases

-   SaaS and product landing pages where social proof needs to convert, not just exist
    
-   Agency and studio portfolios showcasing client feedback with visual polish
    
-   Startup homepages that need a dynamic, trust-building testimonial section above the fold
    
-   Brand websites where design quality signals credibility at first glance
    

Ship a testimonial section that feels as refined as the product it represents.

## Questions or custom requests?

We design and build custom Framer components. Get in touch at [**contact@teampixel.com.au**](mailto:contact@teampixel.com.au).

## Rank history [How rankings work →](/terms#rankings)

-   All · #9888

## Details

- **Author**: Aidan Looker
- **Price**: $9.00
- **Published**: 2026-05-08
- **Updated**: 2026-06-13
- **Added**: 2026-04-29
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow