Blocks
Testimonial columns block
A wall of short quotes in columns that drift slowly, alternate columns in opposite directions and at different speeds, faded at top and bottom. Hover or focus stops it so any quote can be read in place.
pnpm dlx shadcn@latest add @caliper/testimonial-columns-blockWhat teams say
Month-end, without the dread
We closed March in two days. It used to take nine.
It reads like a tool made by people who have done a close.
The written summary goes straight to the board pack.
I trust the numbers on Monday morning now.
The rules editor is the first one our team actually uses.
Multi-entity used to be a spreadsheet. Now it's a filter.
Matching suggestions are right more often than I am.
Keyboard shortcuts everywhere. My hands never leave the keys.
Approvals stopped living in email. That alone was worth it.
Our auditors asked what we changed. Everything is linked.
Setup took an afternoon, with our own bank feeds.
It is calm. Finance software is never calm.
When to use
Use it for
- Many short quotes, twelve or more.
- Landing pages where the volume of praise is the point.
Skip it when
- A few long quotes; use the testimonials block.
- Quotes people must read in order.
Decisions
Why it is built this way, so you know what to keep when you change your copy.
Behaviour
- Pause in reach
- Hover and focus pause it, and a Pause button stops it for good, as continuous motion longer than five seconds must offer.
Usage
- Each quote once
- The loop's second copy is hidden and inert, so readers and tab order meet each quote once.
Installation
pnpm dlx shadcn@latest add @caliper/testimonial-columns-block
Adds its 5 files to components/ui/, each with its own stylesheet, and installs their packages. Pro installs with your access token, set up once per project. See Pro access. The first part also adds Caliper UI’s tokens; import them once as in Installation.
Usage
Import it from your copy of the source. The example behind the preview comes with the source.
import { TestimonialColumnsBlock } from "@/components/ui/testimonial-columns-block"
The worked example comes with Pro
The 34-line example behind the preview opens here, ready to copy.
- 576 Pro parts, blocks and page templates, all with source
- $199 once, with a year of updates. What you have stays yours
- A full refund within 14 days if it is not for you
API reference
TestimonialColumnsBlock
component
Accessibility
It is built on native elements and keeps aria-pressed and aria-hidden in step with state.
No custom key handling; Tab and the native activation keys do the work.
Motion
It declares no animation in its component source. Any transition comes from its stylesheet, which uses the duration tokens that collapse to instant under prefers-reduced-motion.