¿Funciona en navegadores antiguos?

Es compatible con la mayoría de los navegadores modernos, e incluimos el prefijo `-webkit-backdrop-filter` para Safari.

¿El backdrop-filter ralentiza el scroll?

Un radio de desenfoque grande exige más GPU, así que en páginas con varias tarjetas de cristal superpuestas conviene mantenerlo por debajo de 20px.

El resultado es CSS puro: puedes pegarlo tal cual en una clase o traducirlo a utilidades de Tailwind como backdrop-blur y bg-opacity.

Ajusta la opacidad, el desenfoque (backdrop-filter) y el brillo del borde con controles deslizantes y genera al instante el CSS del efecto cristal

Crea el popular efecto glassmorphism ajustando opacidad, desenfoque y bordes redondeados con deslizadores, y obtén un código CSS listo para copiar.

도구를 불러오는 중…

🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.

¿Funciona en navegadores antiguos?: Es compatible con la mayoría de los navegadores modernos, e incluimos el prefijo `-webkit-backdrop-filter` para Safari.
¿El backdrop-filter ralentiza el scroll?: Un radio de desenfoque grande exige más GPU, así que en páginas con varias tarjetas de cristal superpuestas conviene mantenerlo por debajo de 20px.
¿Puedo usarlo en un proyecto con Tailwind?: El resultado es CSS puro: puedes pegarlo tal cual en una clase o traducirlo a utilidades de Tailwind como backdrop-blur y bg-opacity.