Gerador de CSS Glassmorphism (Efeito de Vidro Fosco)
Gere um efeito CSS glassmorphism (vidro fosco) com pré-visualização e código pronto para copiar.
Glass
🔒 100 % no cliente — nenhum dado enviado
Crie um efeito glassmorphism de vidro fosco e copie o CSS pronto para colar (backdrop-filter, transparência, blur, borda). Ajuste blur, opacidade e raio em tempo real com uma pré-visualização ao vivo. Nenhum dado é enviado: tudo é gerado no seu navegador.
What is it for?
- ▸ Crie cards e modais com vidro fosco
- ▸ Prototipe rapidamente uma UI moderna translúcida
- ▸ Ajuste blur e opacidade com pré-visualização instantânea
- ▸ Copie CSS limpo e compatível com navegadores
FAQ
Qual propriedade CSS cria o efeito de vidro?
É principalmente backdrop-filter: blur(), combinado com um fundo semitransparente e uma borda clara.
Glassmorphism funciona em todos os navegadores?
A maioria dos navegadores modernos oferece suporte; um prefixo -webkit-backdrop-filter melhora a compatibilidade.
Posso usar o CSS gerado gratuitamente?
Sim, o código é gratuito para uso em seus projetos pessoais ou comerciais.
Related tools
Proporção · calculadora Calcule uma proporção (16:9...) e derive uma dimensão proporcional ausente. Gerador de código de barras Gere um código de barras (EAN-13, Code128, UPC) a partir de um valor, baixável, no seu navegador. Base64 → imagem Decodifique um data URI ou Base64 em uma imagem visualizável e baixável, no seu navegador. CSS border-radius · gerador Crie cantos arredondados em CSS (border-radius) com pré-visualização ao vivo e código pronto para copiar. CSS box-shadow · gerador Gere um CSS box-shadow com pré-visualização ao vivo e código pronto para copiar. Removedor de fundo verde Torne uma cor de fundo (tela verde/azul) transparente e exporte um PNG, no seu navegador.