Design Tools
Gerador de Glassmorfismo
Crie efeito de vidro fosco com desfoque CSS e transparência
Efeito de Vidro
É assim que seu efeito de glassmorfismo ficará.
Button 1
Button 2
Efeito de Vidro
10px
25%
180%
16px
Borda
1px
18%
Sombra
32px
37%
Fundo
.glass {
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px) saturate(180%);
-webkit-backdrop-filter: blur(10px) saturate(180%);
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.18);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
}Suporte do Navegador
A propriedade backdrop-filter é suportada em navegadores modernos. Para navegadores mais antigos, considere fornecer um fallback.
Por que usar Gerador de Glassmorfismo?
- ✓100% Grátis - Sem custos ocultos ou recursos premium
- ✓Sem cadastro - Use instantaneamente sem criar conta
- ✓Privacidade em primeiro lugar - Todo processamento acontece no seu navegador. Seus dados nunca saem do seu dispositivo
- ✓Ultra rápido - Resultados instantâneos sem atrasos de servidor
Como Usar
- Digite ou cole seu texto na área de entrada acima
- A ferramenta processará sua entrada automaticamente
- Copie o resultado ou baixe como arquivo
Recursos
- ✓Adjustable blur amount
- ✓Transparency control
- ✓Border and shadow options
- ✓Background image preview
- ✓CSS and Tailwind output
- ✓Browser compatibility info
Perguntas Frequentes
Is glassmorphism supported in all browsers?
The backdrop-filter property is supported in most modern browsers, but may require prefixes for Safari.