Split With Quote
CTA copy and buttons beside a customer quote card with a matching avatar.
CTA copy and buttons beside a customer quote card with a matching avatar.
Search blocks by description or jump to a page.
The source for every Marketing block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Split With Quote is a two column section. The left column holds a heading, a supporting paragraph, and two action buttons stacked side by side. The right column is a bordered card containing a blockquote, and below the quote a figcaption with an avatar, a name, and a job title and company on a second line. On large screens the columns sit side by side at equal width with vertically centered alignment; on small screens they stack.
The two sides are fully independent. You can rewrite the heading, supporting copy, and button labels without affecting the quote card, and vice versa. The customer details in the figcaption (name, title, company) are plain text, so swapping them for a different customer takes seconds.
This layout works well at the bottom of a features page or below a pricing table, where a visitor who has read the pitch needs one more reason to act. The quote card adds social proof at the moment of decision without sending the reader to a separate testimonials page. For a developer tools company this is a natural spot to show a quote from an engineering lead or a CTO alongside a call to start a free trial or book a demo.
Compared to With Stats, which backs the CTA with numbers, this block backs it with a named person, which tends to land better when the audience cares about peer credibility over aggregate data.
A natural flow around it on a Marketing Pro page:
Before
After
Swap in a customer whose role matches the product story you are telling. A few other ways to use the frame:
Tip: keep the quote to two or three sentences so it stays readable at a glance and does not visually outweigh the CTA copy on its left.