<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="styles.css">
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-34179656-2"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-34179656-2');
</script>
<link rel="icon" type="image/png" href="favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Convert image to base64. Encode and decode text to base64. We take privacy very serious so all the images are not uploaded to our servers.">
<meta name="author" content="Adrián Fernández (https://adrianfernandez.es)">
<meta name="robots" content="index,follow">
<link rel="canonical" href="https://tobase64.dev/" />
<meta name="keywords" content="image, base64, decode, encode, text" />
<meta property="og:description" content="Convert image to base64. Encode and decode text to base64. We take privacy very serious so all the images are not uploaded to our servers." />
<meta property="og:image" content="https://tobase64.dev/base64-rrss.png" />
<meta property="og:title" content="Convert images to base64, Encode text to base64 - Tobase64.dev" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="ToBase64.dev - Convert Images to base64, Encode Text to base64" />
<meta property="og:url" content="https://tobase64.dev" />
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:creator" content="@adri1177" />
<meta property="twitter:description" content="Convert image to base64. Encode and decode text to base64. We take privacy very serious so all the images are not uploaded to our servers." />
<meta property="twitter:title" content="ToBase64.dev - Convert Images to base64, Encode Text to base64" />
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<link rel="apple-touch-icon" sizes="120x120" href="apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="152x152" href="apple-touch-icon-152x152.png" />
<link rel="stylesheet" href="styles.css">
<script type="text/javascript" src="aviso-cookies.min.js"></script>
<script type="text/javascript">var imageB64 = "Select an image..."</script>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-7229011718718774",
enable_page_level_ads: true
});
</script>
<!-- Global site tag (gtag.js) - Google Ads: 749955722 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-749955722"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-749955722');
</script>
{% block stylesheets %}{% endblock %}
</head>
<body class="d-flex flex-column h-100">
<header>
<nav class="navbar navbar-expand-lg fixed-top navbar-dark navbar-bg text-center">
<a class="navbar-brand mr-auto mr-lg-0" href="{{ path('homepage') }}" title="ToBase64">
<img src="base64.png" width="45" height="30" class="logo d-inline-block align-top" title="Home" alt="Home page">
</a>
<button class="navbar-toggler p-0 border-0" type="button" data-toggle="offcanvas">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse offcanvas-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
{% set route = app.request.attributes.get('_route') %}
<li class="nav-item {{ route == 'image-to-base64' ? 'active' }}">
<a class="nav-link" href="{{ path('image-to-base64') }}" title="Image to base64">Image to base64</a>
</li>
<li class="nav-item {{ route == 'base64-to-image' ? 'active' }}">
<a class="nav-link" href="{{ path('base64-to-image') }}" title="Base64 to image">Base64 to image<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item {{ route == 'text-to-base64' ? 'active' }}">
<a class="nav-link" href="{{ path('text-to-base64') }}" title="Text to base64">Text to base64</a>
</li>
<li class="nav-item {{ route == 'base64-to-text' ? 'active' }}">
<a class="nav-link" href="{{ path('base64-to-text') }}" title="Base64 to text">Base64 to text</a>
</li>
<li class="nav-item {{ route == 'pdf-to-base64' ? 'active' }}">
<a class="nav-link" href="{{ path('pdf-to-base64') }}" title="PDF to base64">PDF to base64</a>
</li>
<li class="nav-item {{ route == 'base64-to-pdf' ? 'active' }}">
<a class="nav-link" href="{{ path('base64-to-pdf') }}" title="Base64 to PDF">Base64 to PDF</a>
</li>
<li class="nav-item {{ route == 'audio-to-base64' ? 'active' }}">
<a class="nav-link" href="{{ path('audio-to-base64') }}" title="Audio to base64">Audio to base64</a>
</li>
<li class="nav-item {{ route == 'base64-to-audio' ? 'active' }}">
<a class="nav-link" href="{{ path('base64-to-audio') }}" title="Base64 to audio">Base64 to Audio</a>
</li>
<li class="nav-item {{ route == 'programming-examples' ? 'active' }}">
<a class="nav-link" href="{{ path('programming-examples') }}" title="Programming Examples">Programming Examples</a>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="nav-item {{ route == 'contact-us' ? 'active' }}">
<a class="nav-link" href="{{ path('contact-us')}}" title="Contact us">Contact us</a>
</li>
</ul>
</div>
</nav>
</header>
<main class="flex-shrink-0 flex-grow-1">
<div class="container d-flex flex-column h-100">
{% include 'display_messages.html.twig' %}
<div class="alert alert-info alert-dismissible fade show mt-2" role="alert">
<strong>Help us!</strong> Don't block ads to help us.
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="row" style="padding-top: 2em;padding-bottom: 2em;">
<h1 class="col-12 text-center">{% block h1 %}{% endblock %}</h1>
</div>
{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}
</div>
</main>
<footer class="footer mt-auto py-3 text-center">
<div class="container">
<span class="text-muted">ToBase64.dev | <a href="https://adrianfernandez.es" style="color:inherit;">Adrián Fernández</a> | <a href="https://aprendemecanografia.es" style="color:inherit;">AprendeMecanografia.es</a> | CopyRight © <script type="text/javascript">var d = new Date();document.write(d.getFullYear());</script></span>
</div>
</footer>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<script src="index.js"></script>
</html>