See also:

Generating data URLs in JavaScript

How to generate data URLs in JavaScript?
Stylized link icon

All data URLs begin with data:, followed by the optional media type, encoding, and the data itself.

Below are examples of data URLs (data URIs) and how to generate them.

text/plain data, UTF-8 encoding

const data = 'Hello World!'

text/plain data, base64 encoding

const data = 'Hello World!'
console.log(`data:text/plain;base64,${btoa(data)}`) // Browser
console.log(`data:text/plain;base64,${Buffer.from(data).toString('base64')}`) // Node.js

text/html data, base64 encoding

const data = '<b>Hello World!</b>'
console.log(`data:text/html;base64,${btoa(data)}`) // Browser
console.log(`data:text/html;base64,${Buffer.from(data).toString('base64')}`) // Node.js

image/svg+xml data, base64 encoding

const data = 
    `<?xml version="1.0"?>
    <svg xmlns="" height="100" width="100">
        <circle cx="50" cy="50" r="20" fill="yellow" />
console.log(`data:image/svg+xml;base64,${btoa(data)}`) // Browser
console.log(`data:image/svg+xml;base64,${Buffer.from(data).toString('base64')}`) // Node.js
Last updated on 3/2/2020 by Anton Vasetenkov.