Gemini API — Base64 Image Input

Gemini's generateContent API takes images as raw Base64 (no data: prefix) inside an inline_data part with a mime_type and data. Drop an image below to get the exact part, plus copy-paste Python and JavaScript. Encoded locally — your image is never uploaded.

Drop an image here or click to browse

PNG · JPG · WebP · HEIC · HEIF

— —

RAW BASE64

Copy

Raw Base64 output

GEMINI inline_data PART

Copy

Gemini inline_data part

Waiting for an image

How to send a Base64 image to Gemini

Drop an image above (or click to browse). The tool reads it locally, Base64-encodes the bytes, and detects the mime_type. Copy the raw Base64 on its own, or the ready-made inline_data part to drop straight into a request. In the generateContent REST body, the image goes in an inline_data part next to a text part with your prompt:

{
  "contents": [{ "parts": [
    { "inline_data": { "mime_type": "image/png", "data": "<BASE64>" } },
    { "text": "What's in this image?" }
  ]}]
}

In Python, the google-genai SDK wraps this for you with types.Part.from_bytes — pass the raw bytes and a mime_type and it builds the inline part:

from google import genai
from google.genai import types

client = genai.Client()
image_bytes = open("image.png", "rb").read()
resp = client.models.generate_content(
    model="gemini-2.5-flash",
    contents=[
        types.Part.from_bytes(data=image_bytes, mime_type="image/png"),
        "What's in this image?",
    ],
)
print(resp.text)

In JavaScript, the @google/genai SDK takes the Base64 string directly in an inlineData object:

import { GoogleGenAI } from "@google/genai";
import { readFileSync } from "fs";

const ai = new GoogleGenAI({});
const data = readFileSync("image.png").toString("base64");
const resp = await ai.models.generateContent({
  model: "gemini-2.5-flash",
  contents: [
    { inlineData: { mimeType: "image/png", data } },
    { text: "What's in this image?" },
  ],
});
console.log(resp.text);

inline_data vs inlineData

This trips people up constantly: the field has two casings depending on where you write it. The REST API and raw JSON body use snake_case — inline_data and mime_type. The JavaScript SDK (@google/genai) uses camelCase — inlineData and mimeType. They mean exactly the same thing; only the casing differs. The Python SDK sidesteps the question entirely by building the part for you with types.Part.from_bytes(data=..., mime_type=...), so you rarely type either name directly. If Gemini rejects your image, check that your casing matches the surface you're calling.

Size limits: 20MB and the Files API

Inlining works only for smaller images. The total inline generateContent request must be under 20MB — and that budget counts the Base64 text, which is roughly 33% larger than the original file, plus any other parts. A ~15MB photo will blow past the limit once encoded. For anything approaching that size, upload the image with the Files API first and reference the returned file in your request instead of embedding the Base64. Inline is simplest for screenshots, icons, and typical web images; the Files API is the path for large or reused assets.

Common errors

• Wrong mime_type: the declared type must match the actual bytes. Sending a JPEG as image/png can cause a decode error or a bad result. This tool sets it from the file you drop in.
• Including a data: prefix in data: the data field is raw Base64 only. Leaving a data:image/png;base64, prefix on the string corrupts the image — strip it (the Raw Base64 box above already has none).
• Exceeding 20MB inline: a large image plus its ~33% Base64 overhead can push the request over the inline ceiling. Use the Files API instead.
• Casing mismatch: using inline_data/mime_type with the JS SDK (which wants inlineData/mimeType), or vice versa. Match the surface you're on.

Is this private?

Yes. The encoding runs entirely client-side in JavaScript — your image is read into memory in the browser and Base64-encoded locally. It is never sent to a server from this page (you send it to Gemini yourself, from your own code). You can confirm in DevTools → Network: adding an image here fires no upload request.

Frequently asked questions

How do I send a Base64 image to Gemini?

Encode the image to raw Base64 (no data: prefix) and put it in an inline_data part with a mime_type, inside the parts array of a generateContent request. Add a text part with your prompt, then call generateContent on a vision model like gemini-2.5-flash. The tool above gives you both the raw Base64 and a ready-to-paste part.

Do I include the data: prefix for Gemini?

No. The data field takes the raw Base64 payload only. Do not include a data:image/png;base64, prefix — that belongs in HTML/CSS data URIs, not in Gemini's inline_data.data. Including it corrupts the image.

What's the difference between inline_data and inlineData?

Same field, different casing. REST and the raw JSON body use snake_case (inline_data, mime_type); the JavaScript SDK uses camelCase (inlineData, mimeType). The Python SDK usually builds the part for you via types.Part.from_bytes, so you write neither directly.

What's the max inline image size?

The total inline request must stay under 20MB, including the Base64 image (about 33% larger than the file). Above that, upload the image with the Files API and reference it instead of inlining.

What image formats does Gemini support?

Common vision formats including PNG (image/png), JPEG (image/jpeg), WebP (image/webp), HEIC (image/heic), and HEIF (image/heif). Set mime_type to match the actual file — this tool detects it for you.