---
title: Inspecting your Open Graph metadata
product: vercel
url: /docs/deployments/og-preview
type: how-to
prerequisites:
- /docs/deployments
related:
- /docs/deployments/deployment-protection
- /docs/og-image-generation
summary: Learn how to inspect and validate your Open Graph metadata through the Open Graph deployment tab.
install_vercel_plugin: npx plugins add vercel/vercel-plugin
---
# Inspecting your Open Graph metadata
You can use the **Open Graph** section in the sidebar on every deployment on Vercel to validate and view your [Open Graph (OG)](https://ogp.me/ "Open Graph (OG)") data across a range of social media sites before you share it out. Routes using [Deployment Protection](/docs/deployments/deployment-protection) can also be inspected.
To view your data:
1. Choose your account or team from the team switcher
2. Select your project and open [**Deployments**](https://vercel.com/d?to=%2F%5Bteam%5D%2F%5Bproject%5D%2Fdeployments\&title=Go+to+Deployments) in the sidebar
3. From the **Deployments** section in the sidebar, select the deployment you wish to view the metadata for
4. Select the Open Graph tab:
5. From here, you can view the metadata and a preview for [Twitter](/docs/deployments/og-preview#twitter-specific-metadata), Slack, Facebook, and LinkedIn for [specific pages](/docs/deployments/og-preview#filter-by-pathname) in your deployment
## Filter by pathname
You can use the **Path** dropdown to view the OG card for any page on that particular deployment.
## Metadata
These properties set by the [Open Graph protocol](https://ogp.me/#metadata).
| Property | Value | Description |
| ---------------- | ----------------------------------------------------------------------- | -------------------------------------------------------------------------------------------- |
| `title` | The title tag used to name the page. 70 characters max. | This is used by default if no other values are passed. |
| `description` | The meta.description tag used to describe the page. 200 characters max. | This is used by default if no other values are passed. |
| `og:image` | Absolute URL to image. | Use the [OG Image Generation](/docs/og-image-generation) documentation to create new images. |
| `og:title` | A title for link previews. | You can use this to override the meta title if you want the OG title to be different. |
| `og:description` | A one to two sentence description for link previews. | You can use this to override the meta description if you want the OG title to be different. |
| `og:url` | A canonical URL for link previews. | You should provide the absolute URL. |
```html filename="index.js"
A page with Open Graph Image.
```
### Twitter-specific metadata
| Property | `content` value | Additional information |
| --------------------- | --------------------------------------------------------------------------------------------- | ----------------------------------------------------- |
| `twitter:image` | A URL to an image file or to a dynamically generated image. `og:image` is used as a fallback. | `JPG`,`PNG`, `WEBP` and `GIF`. `SVG` is not supported |
| `twitter:card` | The type of card used for Twitter link previews | `summary`, `summary_large_image`, `app`, or `player` |
| `twitter:title` | A string that shows for Twitter link previews. `og:title` is used as a fallback. | 70 characters max |
| `twitter:description` | A description for Twitter link previews. `og:description` is used as a fallback. | 200 characters max |
```html filename="index.js"
A page with Open Graph Image.
```
---
[View full sitemap](/docs/sitemap)