Gerador de Efeito Glassmorphism em CSS

Design e Gráficos

Gere cartões com visual de vidro fosco moderno utilizando backdrop-filter em CSS puro e classes Tailwind.

Configurações do efeito de vidro

Desfoque (Blur)16px
Opacidade (Transparência)%25
Largura da borda1px
Opacidade da borda%20
Raio dos cantos20px
#ffffff
ToolsApp Glass

Modern Frosted Glass

Experimente uma interface glassmorphism impecável com desfoque de fundo em tempo real e refração de luz.

blur(16px)opacity(25%)
CSS Code
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.20);
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.15);
Apoio a Projeto Independente

Gostou do ToolsApp? Pague-nos um café

O ToolsApp funciona 100% no seu navegador, sem assinaturas e sem rastreamento de dados. Acreditamos que utilitários digitais essenciais devem ser livres e acessíveis para todos. Seu apoio nos ajuda a manter a plataforma e criar novas ferramentas!

100% No NavegadorGratuito para Todos

Como Usar?

1

Ajustar Desfoque e Opacidade

Ajuste com precisão o desfoque de fundo (backdrop blur) e a transparência.

2

Testar Fundos

Pré-visualize sobre gradientes coloridos e vibrantes.

3

Copiar CSS / Tailwind

Exporte o trecho de código CSS para os seus ficheiros de estilo.

Privacidade TotalTodos os cálculos e processamentos de arquivos ocorrem 100% localmente no seu navegador via JavaScript no lado do cliente.

Avaliações e Comentários de Usuários

Compartilhe sua experiência anonimamente. Moderado automaticamente por IA.

5.0
0 avaliações
5 / 5
0/500
Protegido pelo sistema de moderação automática do Groq AI

Avaliações Aprovadas (0)

Carregando avaliações...