Quote

Demonstrate credibility and highlight key messages

Placeholder
Demo - Use short, impactful quotes to convey important ideas and boost trust. They should sound believable and authentic, not scripted or jargon-heavy.
Placeholder
Name, Role, Company Name
You can use quotes as vehicle to highlight key messages of your page, with or without an accompanying headshot.
Name, Role, Company Name

Overview

Demonstrate credibility and highlight key messages

Quotes add gravitas to your content, particularly when attributed to a subject matter expert. You can also use them to draw the eye to key messages, helping to make content more engaging and memorable.  

The Quote component is suitable for any content type.  

When to use 

  • You have a pithy quote from an individual stakeholder, like a team member or client 
  • There’s a key message you want to highlight 

You can also include a headshot, which will appear to the left of the quote. User' eyes are automatically drawn to faces, so this can boost the visibility of your quote (and make them more likely to pause and read it).

When not to use 

If your message would look better in another format, such as Stats and Facts.   

How to use it

Text  

Add what you want to say to the text box. It should sound believable, like you are reporting actual dialogue said by a real person. Read your quote out loud to check it passes the test.  

When attributing a quote to an individual, you can add their name and job title, alongside a small headshot (optional).  

Recommend image specifications

Quoting an individual is about helping you build credibility. So make sure the headshot shows your subject matter expert in their best light. That means both their clothes and expression should be professional.  

For best performance, follow the recommended image specifications: 

FormatOrientationDimensionsFile size
JPGSquare 200px x 200px<100kb

For more information on how to use images in the CMS go to the Image Basics page.  

Do's and don'ts

  • Don’t use more than 30 words

    Check the page in mobile view to make sure the quote is short enough. If you need to scroll to read the whole quote, it’s too long.  

  • Don’t use portrait-format images

    Portrait images can look cropped, distorted, or leave empty space on wide screens.