Document special characters in frontmatter (#3462)

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Devin Logan <devinannlogan@gmail.com>

Author: devin-ai-integration[bot]

fern/products/docs/pages/customization/frontmatter.mdx

@@ -4,7 +4,13 @@ subtitle: Set titles, add meta descriptions, and more
 description: Use frontmatter to set a variety of page properties and metadata.
 ---
 
-You can optionally use frontmatter to set each page's title, full slug override, meta description, a URL to suggest edits to the page, and its OpenGraph image. You can also use frontmatter to disable certain page elements like the table of contents, on-page feedback, and page actions. For advanced styling and functionality customizations beyond frontmatter options, see [custom CSS and JavaScript](/docs/customization/custom-css-js). 
+You can optionally use frontmatter to set each page's title, full slug override, meta description, a URL to suggest edits to the page, and its OpenGraph image. You can also use frontmatter to disable certain page elements like the table of contents, on-page feedback, and page actions. 
+
+<Tip>
+  For advanced styling and functionality customizations beyond frontmatter options, see [custom CSS and JavaScript](/docs/customization/custom-css-js). 
+</Tip>
+
+## Frontmatter syntax
 
 Frontmatter must be added to the top of a `.md` or `.mdx` file, before the rest of the content. Use sets of three dashes to indicate the beginning and end of your frontmatter, as shown:
 
@@ -22,7 +28,17 @@ og:title: SEO Metadata Title
 ```
 </CodeBlock>
 
-## Title 
+### Special characters
+
+Frontmatter uses YAML syntax, but values are also processed as MDX. Some characters need quoting, while others need backslash escaping.
+
+| Characters | Solution | Example |
+|------------|----------|---------|
+| `:` `#` `&` `*` `!` `%` | Wrap in quotes | `title: "OAuth: A guide"` |
+| `{` `}` `<` `>` | Escape with `\` | `title: "Using \<Callout\>"` |
+| `"` `'` | Opposite style or `\` | `title: 'The "best" practices'` |
+
+## Title
 
 <ParamField path="title" type="string" required={false} default="Page name from docs.yml">
   Sets the page's [`<title>` element](https://web.dev/learn/html/document-structure#document_title). This appears in browser tabs, bookmarks, and search results.