Fix Flutter Base64 Decode Errors

A Flutter FormatException: Invalid character (at character 5) when calling base64Decode almost always means you passed a data URL — the data:image/png;base64, prefix must be stripped first. The other common causes are missing padding and a URL-safe (-/_) string. Paste your Base64 below to see what's wrong.

Why does Flutter throw FormatException: Invalid character?

Dart's base64Decode (and the underlying base64.decode) is strict: it accepts only the raw Base64 alphabet A–Z a–z 0–9 + / plus = padding. Any other character throws FormatException: Invalid character, and the position it reports points at the first offending byte. There are three common triggers:

• A data URL prefix. Strings like data:image/png;base64,iVBOR... include a media-type header. Character 5 is the : in data:, which is why the error so often says at character 5.
• URL-safe Base64. Tokens and API payloads often use - and _ instead of + and /. base64Decode rejects those; you need base64Url.decode.
• Missing padding. If the source stripped the trailing = characters, the length is no longer a multiple of 4 and decoding fails. base64.normalize() restores it.

Strip the data: URL prefix

The single most common fix: split on the comma and keep only the part after it. Everything up to and including the comma is the header, not Base64.

// dataUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUg..."
final clean = dataUrl.split(',').last;   // everything after the comma
final bytes = base64Decode(clean);       // Uint8List — decodes cleanly

// Guard for strings that may or may not have a prefix:
final payload = dataUrl.contains(',') ? dataUrl.split(',').last : dataUrl;
final bytes2 = base64Decode(payload);

Fix padding and URL-safe Base64

If your string uses the URL-safe alphabet (- and _), decode it with base64Url. If it is also missing its trailing = padding — common for JWTs and signed tokens — run it through base64.normalize() first, which adds the padding and converts URL-safe characters back to the standard alphabet.

import 'dart:convert';

// URL-safe Base64 (contains - or _):
final bytes = base64Url.decode(token);

// Missing padding? normalize() repairs it, then decode:
final normalized = base64.normalize(token);   // adds '=' as needed
final bytes2 = base64Decode(normalized);

// One-liner that tolerates missing padding on URL-safe input:
final bytes3 = base64Url.decode(base64Url.normalize(token));

Displaying a Base64 image in Flutter

Once you have clean Base64, decode it to a Uint8List and hand it to Image.memory. This is why a Base64 image "not showing" is almost always a decode error upstream — fix the string and the widget renders. Remember to strip the data: prefix first.

import 'dart:convert';
import 'package:flutter/material.dart';

Widget buildImage(String source) {
  // Strip the data: prefix if present, then decode.
  final clean = source.contains(',') ? source.split(',').last : source;
  final bytes = base64Decode(clean);
  return Image.memory(bytes);   // renders PNG / JPEG / GIF / WebP bytes
}

Is this private?

Yes. The diagnosis and decoding run fully in your browser with JavaScript — your Base64 is inspected and decoded locally and nothing is uploaded to any server. You can confirm in DevTools → Network: pasting fires no request.

Frequently asked questions

Why does Flutter throw FormatException: Invalid character (at character 5)?

Character 5 is usually the colon or slash inside a data: URL prefix like data:image/png;base64,. base64Decode accepts only raw Base64, so strip the prefix with dataUrl.split(',').last. The other causes are a URL-safe string (containing - or _) or missing = padding.

How do I strip the data:image prefix in Flutter?

Split the string on the comma and keep the last part: final clean = dataUrl.split(',').last; then call base64Decode(clean). Everything up to and including the comma is the media-type header, not Base64.

How do I decode URL-safe Base64 in Flutter?

If the string contains - or _ instead of + and /, use base64Url.decode(input) instead of base64Decode. If padding is also missing, wrap it with base64.normalize(input) first, which adds the required = characters.

How do I show a Base64 image in Flutter?

Strip any data: prefix, then pass the decoded bytes to Image.memory: Image.memory(base64Decode(clean)). This renders PNG, JPEG, GIF, and WebP bytes directly without writing a file.