Inserting a Base64 Image into an HTML Page

Google Sheets allows you to customize the sidebar and dialog boxes as you like, including the possibility of adding an image, a logo, etc.

To insert an image, the image URL is generally required.

However, to avoid having to host your images somewhere, a solution is to insert them directly in a text format (in base64) for a visually identical result.


Converting the Image

The first step is to convert the image to base64.

You can do this very simply by using the free base64 image converter on the site.

Inserting the Image

Then insert the image using the img tags (to be copied from the converter page) in the HTML code between the body tags.

Here is an example of an image:

logo insert image

This same image in base64 with the img tags:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAMAAAC5zwKfAAAAPFBMVEX////w8fnIyejj5fREXbovG50fCpZHX7v8/P46VLbV1+6lq9u2u+Jtf8lPPqxZb8KAkNCLgMmVmtRvYbtah6vlAAADrUlEQVR42q2Yi46zKhSFNxdhbS6i9P3f9QB1Yk9VrP5+mclM0vRj4YKdtPQAoEcBCHhQVpApEJ6SAWpiTgJ4JF94kUhsLWfCTxF6uBiCMTP5ItTsFuNtJWhi60aTgchsvcCpjJTrKEEqecgazPGkiM6FiDwdKvHxS44Ip0ZQYMt6X4k/G5xc/lO+bwSE1dYeKZFHgco4tL/kB9PU/Wfe2CoBN5Z6W04Z3nGzMS9Cz+eqb18JcsNQE7Vm80Qg0Dgr9BvR1h4oW6DhpdTQjjUHQoEq6DXSWJVRrm8AXpIIrwxk5mnppXsErbZfMK/KCt4WEQNAbgIV4LqN9JRYnBWQZ/YE0GzCvk9WX08JUpMiQI6uiiRzEgT4UWLHB6QiPFQGEOAsR5AazIgCTZNA55b65usrI0cBmof8MbDdS+1YgdZIV5kClEetRP21A4h5qIf7oJE+uiipqeQoiKSr7tEMgwn9RvpKQUAYlZo4olZchYPYCJG0tT8rC5IteyKIsfhm0WvkXOlFe0Sp3etgXm7vjhQuKBVqPypGEOTmAqI1cgWO1YHcrgoBZ42cw7IZU7s4O2M6aXsNnQSyJ0Ho3JFLsMcw7o8vkNL2Olo54cS+MLK9DkeRI9CfWnea2VIbuQUfBMy3AwbCQ400dEKnkecCBr4dUBB17shl2BMebETXgNj6nLaPBkRkexdFeLARy5nwZCNW7wbM9wNOu42wvQs7wpONcOw08tjcUvofAoI2QISoWT8WsOFy4htOTsDRR0QhJ8v8wNxalaR8ZNa3BusWvH/a1u+Mha0PWLYeomX982DFkU+M4ywXp/JLQ7cDAniZwZjFSYRfGtJWEDq+gjFDc1bODyfnQx+9fV/O04bUYSWLb+PsHk6ejnxi9W2cncOp3ZHQza+xOsxXTrM4IevWuwG3COdX7SbnXkPsDoUAqAElV+2307XD2RusW+tW26TNuR7O/txaAXkvnaAd7ZKzbt0vW+eIU19gZp1i9lLtaFtH7m9ybufW0QcozQVbtMEpfGuNeeeUk07nAeNHiVWrbZp8cOL/2vE9Q5Q7Dei5oVkXVm0JO30+A4IL3kvQCUDwPudpijGltMg+sE27hhV0AQihlHNSho9F6gp6SQvQOVg4elEIoZyra4RW1+8A0jmlRC/HJR9lM1TGwqswzzmXVLIuUxAFEC743Oe8+aSuUfw5yCs7BkYzrIpFMpeM0qma7SLtm5K218XxuT0s/VxrpDlWAMIK3QG0VeBSr/QfMk9sIDrw2FsAAAAASUVORK5CYII=" alt="logo">

The image inserted into the HTML page:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAMAAAC5zwKfAAAAPFBMVEX////w8fnIyejj5fREXbovG50fCpZHX7v8/P46VLbV1+6lq9u2u+Jtf8lPPqxZb8KAkNCLgMmVmtRvYbtah6vlAAADrUlEQVR42q2Yi46zKhSFNxdhbS6i9P3f9QB1Yk9VrP5+mclM0vRj4YKdtPQAoEcBCHhQVpApEJ6SAWpiTgJ4JF94kUhsLWfCTxF6uBiCMTP5ItTsFuNtJWhi60aTgchsvcCpjJTrKEEqecgazPGkiM6FiDwdKvHxS44Ip0ZQYMt6X4k/G5xc/lO+bwSE1dYeKZFHgco4tL/kB9PU/Wfe2CoBN5Z6W04Z3nGzMS9Cz+eqb18JcsNQE7Vm80Qg0Dgr9BvR1h4oW6DhpdTQjjUHQoEq6DXSWJVRrm8AXpIIrwxk5mnppXsErbZfMK/KCt4WEQNAbgIV4LqN9JRYnBWQZ/YE0GzCvk9WX08JUpMiQI6uiiRzEgT4UWLHB6QiPFQGEOAsR5AazIgCTZNA55b65usrI0cBmof8MbDdS+1YgdZIV5kClEetRP21A4h5qIf7oJE+uiipqeQoiKSr7tEMgwn9RvpKQUAYlZo4olZchYPYCJG0tT8rC5IteyKIsfhm0WvkXOlFe0Sp3etgXm7vjhQuKBVqPypGEOTmAqI1cgWO1YHcrgoBZ42cw7IZU7s4O2M6aXsNnQSyJ0Ho3JFLsMcw7o8vkNL2Olo54cS+MLK9DkeRI9CfWnea2VIbuQUfBMy3AwbCQ400dEKnkecCBr4dUBB17shl2BMebETXgNj6nLaPBkRkexdFeLARy5nwZCNW7wbM9wNOu42wvQs7wpONcOw08tjcUvofAoI2QISoWT8WsOFy4htOTsDRR0QhJ8v8wNxalaR8ZNa3BusWvH/a1u+Mha0PWLYeomX982DFkU+M4ywXp/JLQ7cDAniZwZjFSYRfGtJWEDq+gjFDc1bODyfnQx+9fV/O04bUYSWLb+PsHk6ejnxi9W2cncOp3ZHQza+xOsxXTrM4IevWuwG3COdX7SbnXkPsDoUAqAElV+2307XD2RusW+tW26TNuR7O/txaAXkvnaAd7ZKzbt0vW+eIU19gZp1i9lLtaFtH7m9ybufW0QcozQVbtMEpfGuNeeeUk07nAeNHiVWrbZp8cOL/2vE9Q5Q7Dei5oVkXVm0JO30+A4IL3kvQCUDwPudpijGltMg+sE27hhV0AQihlHNSho9F6gp6SQvQOVg4elEIoZyra4RW1+8A0jmlRC/HJR9lM1TGwqswzzmXVLIuUxAFEC743Oe8+aSuUfw5yCs7BkYzrIpFMpeM0qma7SLtm5K218XxuT0s/VxrpDlWAMIK3QG0VeBSr/QfMk9sIDrw2FsAAAAASUVORK5CYII=" alt="logo">
  </body>
</html>

And the result (in a small dialog box):

google sheets logo base64 dialog insert image

The larger and heavier your image, the longer its base64 version will be, so don't hesitate to resize (if necessary) the image and then compress it before converting to base64.