Data URL Encoder
Converta arquivos para Data URLs base64 para incorporação em HTML e CSS.
Sobre esta ferramenta
Uma Data URL é um formato especial de URL que codifica o conteúdo do arquivo diretamente na cadeia de URL, permitindo que você incorpore imagens, fontes e outros recursos em linha no seu HTML e CSS sem requisições HTTP separadas. Esta ferramenta converte qualquer arquivo em uma Data URL codificada em Base64, o que é útil para reduzir solicitações de servidor, melhorar os tempos de carregamento de página para ativos pequenos e simplificar a implantação quando você precisa de marcação autossuficiente.
Para usar a ferramenta, basta fazer upload de um arquivo ou colar seu conteúdo, e o codificador gera instantaneamente uma Data URL que você pode copiar e colar diretamente em sua propriedade CSS background-image, em um atributo HTML img src, ou em outros contextos de incorporação. A ferramenta detecta automaticamente o tipo de arquivo e define o tipo MIME correto na Data URL, para que seu navegador saiba como interpretar o conteúdo incorporado.
Data URLs funcionam melhor para arquivos pequenos, tipicamente menores que 100 KB, pois incorporar arquivos grandes pode inchar seu HTML e CSS. Elas são especialmente valiosas para desenvolvedores web otimizando desempenho, designers incorporando fontes personalizadas, e equipes construindo modelos de email ou aplicações offline-first, onde requisições de ativos externos não são práticas.
Perguntas Frequentes
Implementação de Código
import base64
import mimetypes
from pathlib import Path
def file_to_data_url(filepath: str) -> str:
"""Convert a file to a base64 Data URL."""
path = Path(filepath)
mime_type, _ = mimetypes.guess_type(filepath)
if mime_type is None:
mime_type = "application/octet-stream"
with open(path, "rb") as f:
data = f.read()
encoded = base64.b64encode(data).decode("utf-8")
return f"data:{mime_type};base64,{encoded}"
# Example usage
url = file_to_data_url("image.png")
print(url[:80] + "...")
print(f"Total length: {len(url)} chars")
# Embed in HTML
html = f'<img src="{url}" alt="Embedded image">'Comments & Feedback
Comments are powered by Giscus. Sign in with GitHub to leave a comment.