Base64 Converter Tool

How-to

1. Select the file you want to convert using the input above;
2. Open your browser developer tools:
   • Windows: ctrl + alt + i;
   • Mac: option + cmd + i;
3. Open the 'Console' tab;
4. Copy the base64 code shown in the console;
5. Paste the base64 code into your file (see examples below);

Examples

Background image:

.classsname {
    background-image: url('[copied base64 code]');
}

Source image:

<img src="[copied base64 code]">

Web font:

@font-face {
    font-family: '[font name]';
    src: url('[copied base64 code]');
    font-weight: [font-weight value];
    font-style: [font-weight style];
}