> For the complete documentation index, see [llms.txt](https://docs.civictheme.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.civictheme.io/content-authoring/components/content/quote.md).
# Quote
The "Quote" style allows you to add a visually styled quotation to the page.
Use the "Quote" to highlight a piece of content and provide a reference point. For example, customer testimonials, statistics or data, or quotes from interviews.
### Add a Quote
1. Create a "Content" component and add content.
2. Highlight the content you want to style as the quote, including the reference content.
3. Select the "Block quote" icon in the CK Editor.
2. Then highlight only the reference content.
3. Open the "Styles" select box and select "Small".
### Outcome
### Styling
#### Theme
Every component in CivicTheme, such as the "Content" component, can be shown as a `Light` or `Dark` theme component variant. This allows you to build more engaging landing pages with a mix of light and dark components.
#### Background
Setting a "Background" on a component can make the component visually stand-out on the page. Check the "Background" checkbox to apply a background to the component.
**Tip**
If you want to create a striking stand alone "Quote" with a background to really separate it from other content, you need to put the quote and reference content in its own "Content" component, surrounded by other "Content" components.
The example below shows three separate "Content" components. The first and third components use the `Light` theme. The second component, housing the "Quote" "uses the `Dark` theme, with the Background checkbox filled.
The example below shows three separate Content components. All three components use the `Light` theme, but the component housing the Quote has the Background checkbox filled.
#### Vertical spacing
"Vertical spacing" adds space before, after or both before and after a component. It is used to visually separate a component from other components when they are vertically stacked on the page. Use "Vertical spacing" dropdown to chose one of the appropriate values.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.
Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:
```
GET https://docs.civictheme.io/content-authoring/components/content/quote.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
