# Using languages in your OG image

**Author:** DX Team

---

You can use the following code sample to explore using parameters and different content types with [`next/og`](https://nextjs.org/docs/app/api-reference/file-conventions/metadata/opengraph-image#generate-images-using-code-js-ts-tsx). To learn more about OG Image Generation, see [Open Graph Image Generation](https://vercel.com/docs/og-image-generation).

In this example, your post image uses different languages.

Create an API route handler:

`import { ImageResponse } from 'next/og'; // App router includes @vercel/og. // No need to install it. export async function GET() { return new ImageResponse( ( <div style={{ fontSize: 40, color: 'black', background: 'white', width: '100%', height: '100%', padding: '50px 200px', textAlign: 'center', justifyContent: 'center', alignItems: 'center', }} > 👋 Hello 你好 नमस्ते こんにちは สวัสดีค่ะ 안녕 добрий день Hallá </div> ), { width: 1200, height: 630, }, ); }`

`import { ImageResponse } from 'next/og'; // App router includes @vercel/og. // No need to install it. export async function GET() { return new ImageResponse( ( <div style={{ fontSize: 40, color: 'black', background: 'white', width: '100%', height: '100%', padding: '50px 200px', textAlign: 'center', justifyContent: 'center', alignItems: 'center', }} > 👋 Hello 你好 नमस्ते こんにちは สวัสดีค่ะ 안녕 добрий день Hallá </div> ), { width: 1200, height: 630, }, ); }`

> If you're not using a framework, you must either add `"type": "module"` to your `package.json` or change your JavaScript Functions' file extensions from `.js` to `.mjs`

Preview the OG route locally by running the following command:

`pnpm dev`

Then, browse to `http://localhost:3000/api/og`. You will see the following image:

> Please note that right to left languages are not currently supported.

## More resources

- [Consume the OG route](/docs/og-image-generation#consume-the-og-route)
  
- [Getting started with OG image](/docs/og-image-generation#usage)

---

[View full KB sitemap](/kb/sitemap.md)