WebFaz Backgrounds

Cores, gradientes e texturas para suas ideias

EN

Os fundos são gerados no seu navegador; nada é enviado. Saiba mais

Um fundo com a sua cara.

Combine cores, explore texturas e crie backgrounds para telas, posts e projetos.

Prévia ao vivo1920 × 1080 px
Background personalizado

Arraste na imagem para mover a origem. Você também pode usar os controles X e Y na aba Gradiente. O marcador não aparece no arquivo exportado.

Exportar background

1920 × 1080 px · sem o marcador de edição

Sobre Backgrounds

Cria fundos personalizados com cores, gradientes e texturas, inclusive texturas que se movem e podem ser gravadas em vídeo, para sites, apresentações e redes sociais, com o CSS correspondente.

O que o Backgrounds faz de diferente

Em vez de só exportar uma imagem, o Backgrounds cria fundos em movimento e entrega o fundo em formas que você pode usar direto no site, no vídeo e na contagem do Relógio. Os recursos que mais chamam atenção:

  • Texturas que se movem

    No menu Estilo de textura há 19 modelos animados (bolhas flutuantes, movimento fluido, ondas de cor, anéis, estrelas e bokeh e outros). Escolha um e a prévia passa a se mover. Ajuste as cores e os parâmetros de cada modelo e pause no quadro que preferir.

  • Grave o fundo em vídeo

    Com um modelo animado, Gravar vídeo (WebM) grava a prévia por 4, 8, 12 ou 20 segundos e baixa o arquivo. Se preferir uma imagem, exporte o quadro atual em PNG ou JPG. Para MP4, use a Conversão de Vídeo do WebFaz.

  • CSS da composição completa, pronto para colar

    Um clique em Copiar CSS gera o código com cores, gradiente e textura embutidos: o fundo do site fica idêntico ao da prévia, sem arquivo de imagem.

  • Leve o fundo para outros apps do WebFaz

    Em Usar em outro app, envie o fundo para a Edição de Vídeo (como fundo animado) ou para o Relógio (como fundo da contagem regressiva).

  • Texturas com modos de mistura

    Sobreponha uma textura ao fundo e ajuste estilo, densidade, opacidade e modo de mistura. Gerar nova textura cria outra variação do mesmo estilo.

  • Gradientes com controle fino

    Escolha o tipo, o ângulo e a escala, arraste a origem direto na prévia e parta de paletas prontas ou das suas cores.

  • Resoluções prontas

    Do desktop Full HD a formatos de stories e posts, com a prévia na proporção certa e o tamanho em pixels indicado.

  • Sólido, Surpreenda-me e Meus backgrounds

    Cor sólida em um clique, um sorteio de combinações e um espaço para salvar os fundos que você gostou, neste navegador.

Exemplo na prática

Você precisa de um fundo suave para uma apresentação. Escolhe o tipo gradiente, define duas cores da identidade da empresa, ajusta o ângulo e vê a prévia. Baixa em PNG para os slides e copia o CSS equivalente para usar no site da mesma campanha.

Como usar

  1. Escolha o tipo de fundo (cor, gradiente ou textura).
  2. Ajuste cores, ângulo e intensidade.
  3. Veja a prévia em tempo real.
  4. Baixe em PNG, JPG ou SVG, ou copie o CSS. Em texturas animadas, grave um vídeo WebM.

Limites e cuidados

  • Imagens exportadas em tamanhos muito grandes consomem memória do navegador.

A ferramenta em uma imagem

Os pontos de clique estão numerados. Toque na imagem para vê-la em tamanho original. As demais telas, passo a passo, estão no guia “Como funciona”.

Backgrounds do WebFaz com as abas Sólido, Gradiente e Texturas, os controles de textura, densidade, opacidade e modo de mistura, a prévia ao vivo do fundo e os botões Surpreenda-me, Copiar CSS e Exportar.
Backgrounds: monte o fundo e exporte.
  1. Ponto 1: Escolha entre cor sólida, gradiente ou textura e ajuste cores, ângulo, densidade e mistura.
  2. Ponto 2: Surpreenda-me sorteia uma combinação.
  3. Ponto 3: Escolha a resolução (desktop, stories e outras).
  4. Ponto 4: Exporte a imagem ou copie o CSS. “Salvar nos meus backgrounds” guarda o fundo neste navegador.

Quando usar

  • Criar fundos para apresentações, capas de vídeo e posts em redes sociais.
  • Gerar o CSS de um gradiente para usar no site.
  • Testar combinações de cores antes de fechar uma identidade visual.

Dicas

  • Escolha cores com bom contraste em relação ao texto que vai ficar por cima.
  • Para uso na web, prefira o CSS do gradiente em vez de uma imagem grande.
  • Exporte no tamanho da tela de destino; imagens enormes gastam memória do navegador sem ganho visível.

O que acontece no seu navegador

O fundo é desenhado em um canvas do navegador com as cores, o ângulo e a intensidade que você ajusta, e a prévia se atualiza em tempo real. Ao baixar, a imagem é gerada no tamanho escolhido, em PNG, JPG ou SVG.

O SVG é um formato vetorial: pode ser ampliado sem perder nitidez e costuma ser leve em gradientes. PNG e JPG são imagens de pixels, mais indicadas para uso direto em slides e redes sociais; o JPG é menor, e o PNG preserva transparência.

O CSS equivalente permite reproduzir o fundo em um site sem baixar imagem alguma, o que é mais rápido para gradientes simples.

Ver o guia completo: situações reais de uso, dicas e limites →

Privacidade: Esta ferramenta roda inteiramente no seu navegador: seus arquivos e dados não são enviados a nenhum servidor do WebFaz. Saiba mais.

Perguntas frequentes

Posso usar o fundo comercialmente?
Os fundos são gerados por você a partir de cores e formas; o resultado é seu para usar.
Qual formato escolher?
SVG para gradientes escaláveis e leves; PNG ou JPG quando precisar de uma imagem fixa.
Posso usar o fundo comercialmente?
Sim. Os fundos são criados por você na ferramenta, a partir das cores que escolher.
Qual formato escolher?
SVG para ampliar sem perder qualidade, PNG para imagem nítida e JPG para um arquivo menor.
Posso copiar o CSS?
Sim, a ferramenta mostra o CSS do fundo para você colar no seu site.
A imagem fica com marca d’água?
Não. Os arquivos baixados trazem apenas o crédito discreto do WebFaz nos metadados.
Meus dados são enviados a algum lugar?
Não. Tudo é gerado no seu navegador.