MENU

Base64 Encoder



Choose a file:


BASE64 ENCODER FAQ

Both HTML and CSS files support the use of Base64 data strings. Copy the codes in the tab below and replace "YOUR BASE64 STRING HERE"  with your own Base64 string. Click the tab link below for more information on how to implement different file types in your HTML and CSS documents:

JPEG IMAGES: <img src="data:image/jpeg;base64,YOUR BASE64 STRING HERE"/>
PNG IMAGES:  <img src="data:image/png;base64,YOUR BASE64 STRING HERE"/>
GIF IMAGES:  <img src="data:image/gif;base64,YOUR BASE64 STRING HERE"/>
XML IMAGES: <xml><image>data:image/jpeg;base64,YOUR BASE64 STRING HERE</image></xml>
** replace image/jpeg with image/png or image/gif if you're not using jpegs
JAVASCRIPTS: <script type="text/javascript" src="data:text/javascript;base64,YOUR BASE64 STRING HERE"></script>
CSS: <link rel="stylesheet" type="text/css" href="data:text/css;base64,YOUR BASE64 STRING HERE"/>


IMAGES: .yourclass {background: url('data:image/jpeg;base64,YOUR BASE64 STRING HERE');}
** replace image/jpeg with image/png or image/gif if you're not using jpegs
OPENTYPE FONTS: @font-face{font-family:'yourfontname'; src: url(data:font/opentype;charset=utf-8;base64,YOUR BASE64 STRING HERE);}
WOFF FONTS: @font-face{font-family:'yourfontname'; src: url(data:application/font-woff;charset=utf-8;base64,YOUR BASE64 STRING HERE) format(???woff???);}
TTF FONTS: @font-face{font-family:'yourfontname'; src: url(data:application/font-ttf;charset=utf-8;base64,YOUR BASE64 STRING HERE) format('truetype');}

WANT TO ACHIEVE MAXIMUM PAGE SPEED?



Let us take care of your website performance like we've taken care of our own:
CLICK
to learn more

MORE PAGE SPEED TOOLS

CSS Optimization Test

Analyze your CSS to make improvements to the CSS Delivery.

CSS Compressor

Minimize CSS scripts and files for page speed.

Javascript Optimization Test

Analyzes the Javascript delivery of your web pages.

Javascript Compressor

Minify your JS files and scripts to maximize performance.

GZIP Compression Test

Check whether your web pages have Gzip compression enabled.

Image Optimization Test

Tests your image delivery so you can improve it.

PNG Compressor

Reduce your PNG image filesize while keeping quality.

JPEG Compressor

Play with the quality and size of JPEGs to save disk space.

CSS Sprites Generator

Place multiple images in one image to make fewer requests.

Caching Test

Check how and whether your website files are cached.

Broken Links/Requests Test

Test your web pages for broken links and requests.

HTTP Requests Checker

How many HTTP requests do your web pages produce?

B
Base64 Encoder

Encode JPEG and other files into a Base64 string.

Keep-Alive Checker

Check whether your website has keep-alive settings as enabled.

Line Breaks Remover

Remove line breaks from your scripts to save disk space.

HTTP Header Checker

Check the HTTP server header of your site.