← Todas as ferramentas de texto

Gerador de neumorphism

Crie botões e cards suaves com aparência 3D (soft UI) e copie o CSS.

  • Grátis
  • Sem cadastro
  • Funciona em qualquer dispositivo

Cerca de Gerador de neumorphism

O neumorfismo, ou soft UI, faz botões e cards parecerem levemente saltar da página ou afundar nela usando duas sombras, uma clara e outra escura. Ajuste tamanho, distância, desfoque e forma e copie o CSS. Funciona melhor em fundos de tom médio, onde as sombras correspondentes continuam visíveis.

Como usar: Gerador de neumorphism

  1. Escolha uma cor base para o fundo e o elemento.
  2. Ajuste a distância, o desfoque e a intensidade até aparecer o visual suavemente elevado ou pressionado.
  3. Copie o código CSS box-shadow para o seu projeto.

Por que usar esta ferramenta?

Também conhecido como

Perguntas frequentes

O neumorfismo é bom para a acessibilidade?

Muitas vezes não. O baixo contraste entre o elemento e o fundo dificulta a visão das bordas. Adicione texto claro, bordas ou cor nos botões importantes para que pessoas com baixa visão ainda os encontrem.

Por que meu botão neumórfico some em uma página branca?

O efeito depende de duas sombras sobre uma superfície de tom médio-claro. No branco puro, a sombra clara não aparece. Use um fundo levemente tingido para que as duas sombras fiquem visíveis.

Como faço um botão pressionado ou em baixo-relevo?

Mude a forma para embutida ou pressionada, se a ferramenta oferecer, o que inverte as sombras para dentro do elemento. Use esse estilo para o estado ativo de um botão.

Gerador de neumorphism é grátis?

Sim. Gerador de neumorphism no Toolipedia é de uso gratuito, sem cadastro e sem marca d'água.

É seguro usar?

Sim. Tudo é calculado no seu navegador, e nada do que você digita é enviado ao nosso servidor.

Funciona no meu celular?

Sim. Funciona em qualquer navegador moderno no Android e no iPhone, além de tablets e computadores. Não é preciso instalar nada.

Preciso de uma conta?

Não. É só abrir a página e usar a ferramenta. Sem cadastro e sem e-mail.

Posso colocar Gerador de neumorphism no meu próprio site?

Sim. Use o botão «Incorporar no seu site» abaixo da ferramenta para copiar um trecho curto de código e colá-lo na sua página. É grátis, não precisa de conta e a ferramenta continua funcionando dentro da sua página.

Ferramentas relacionadas