O que é um Data URI?

É um esquema de URI que permite incluir dados de arquivos diretamente em documentos como HTML e CSS, codificados geralmente em Base64.

Quais formatos de saída posso gerar?

Você pode gerar a string Data URI pura, uma tag de imagem HTML, uma regra de fundo CSS ou um link de imagem em Markdown.

Existe um limite de tamanho para os arquivos?

Sim, o limite máximo para conversão de arquivos nesta ferramenta é de 10 MB.

Posso alterar o tipo MIME detectado automaticamente?

Sim, você pode usar o campo de tipo MIME personalizado para substituir a detecção automática pelo formato que desejar.

Quando devo usar a codificação URL em vez de Base64?

A codificação URL é ideal para arquivos SVG baseados em texto, pois gera códigos menores e mais legíveis que o Base64.

Elysia Tools

Navegação

Development

Gerador de Data URI

Converte arquivos em Data URIs (Base64 ou porcentagem-codificada) para incorporar imagens, fontes e recursos diretamente em HTML, CSS ou Markdown

Execução

Executar esta ferramenta

Preencha o formulário, execute a ferramenta e veja o resultado no mesmo lugar.

Entradas

Preencha os campos necessários e execute a ferramenta.

4 opções

ArquivosEnvie os arquivos de origem para este fluxo.1

ArquivofileObrigatório

Tamanho máximo por arquivo: 10 MBTipos aceitos: image/png, image/jpeg, image/gif, image/webp, image/avif, image/bmp, image/svg+xml, image/x-icon, image/tiff, audio/mpeg, audio/wav, audio/ogg, audio/flac, video/mp4, video/webm, font/woff, font/woff2, font/ttf, font/otf, application/pdf, text/css, text/javascript, text/plain, text/html, application/json, application/xml, */*

ConteúdoCole ou digite os valores principais.1

Tipo MIMEtextOpcional

ConfiguraçõesAjuste formatos, intervalos, números e modos.2

CodificaçãoselectOpcionalFormato de saídaselectOpcional

Resultado

Pronto para executar

Depois de executar, arquivos, texto, dados estruturados ou saída em streaming aparecerão aqui.

Exemplos

Exemplos compatíveis com esta ferramenta

Relacionado

Gerador de Data URI

Executar esta ferramenta

Entradas

Resultado

Exemplos compatíveis com esta ferramenta

Continue com ferramentas e temas relacionados

Entradas

Resultado

Veja quando usar esta ferramenta, o que ela suporta e como os usuários a aplicam.

Fatos principais

Visão geral

Quando usar

Como funciona

Casos de uso

Exemplos

1. Incorporar Ícone SVG em CSS

2. Inserir Imagem em Assinatura de E-mail

Perguntas frequentes

Exemplos de Processamento de Imagens Web TypeScript

Exemplos de Processamento de Imagem Web Rust

Exemplos PDF

Exemplos de Comunicação em Tempo Real WebRTC

Sequência de Imagens para Vídeo

Folha de Contato PDF

Folha de Storyboard PDF

Ferramenta de Opacidade de Marca d'Água

Ferramentas de codificacao e conversao de audio

Ferramentas de conversao de formatos de imagem e exportacao animada

Ferramentas de intercambio JSON e traducao de formatos

Ferramentas de conversão de caixa, codificação e normalização de texto