base64 images

The images on this page make use of base64 encoding which uses numbers [0-9], letters [a-z], letters [A-Z] and the two characters / and + to provide the encoding which results in what appears to be garbled text. Many files can be encoded in this way and more can be read on Wikipedia Such encoding has many uses. In this instance it allows the images to be embedded in the html and the css. As can be seen the data is large and bloats the code but nevertheless represents a useful technique.

The top image of the woodpacker was taken from pixabay. The second image, used as a background, was borrowed from Sololearn.

There are a number of ways the images can be converted to base64 including BASE64 IMAGE which provides a clear tutorial. In addition many programming languages offer the ability to make the conversion. For those who like to use Python I have uploaded a simple Command Line Tool. Please note that this was written for linux and will not run in the Code Playground.

To close this pannel please left click the info icon agian.

Base64 image used with an img tag

.jpeg converted to base64 and embedded in html

base64 encoded images: created by Richard Myatt