6XC

Generador de Filtros CSS

Combina blur, brightness, contrast, grayscale, hue-rotate, saturate, sepia e invert con vista previa en vivo.

1.025 visitas

6XC

La propiedad filter

filter aplica efectos de edición de imagen a cualquier elemento — fotos, videos, incluso diseños completos. Las funciones se encadenan en una sola declaración: filter: brightness(110%) contrast(120%) saturate(130%) da un look llamativo tipo "Instagram", grayscale(100%) es el clásico estilo homenaje en blanco y negro, y hue-rotate recolorea gráficos sin necesitar nuevos archivos.

Preguntas Frecuentes

¿filter afecta el rendimiento?

La mayoría de los filtros están acelerados por GPU y no dan problemas en unos pocos elementos. El blur es el más costoso — mantén los radios pequeños en superficies grandes, especialmente en móvil.

¿Cuál es la diferencia entre filter y backdrop-filter?

filter afecta al propio elemento y su contenido; backdrop-filter afecta lo que se ve detrás del elemento — eso es lo que usa el glassmorphism.

Herramientas Similares

Generador de Gradientes CSS Diseña gradientes CSS lineales, radiales y cónicos con vista previa en vivo y copia el código. Generar Generador de Sombra CSS (Box Shadow) Diseña una box-shadow de forma visual — desplazamientos, desenfoque, expansión, color, opacidad e inset — con vista previa en vivo. Generar Generador de Border Radius CSS Redondea cada esquina por separado o todas a la vez, en px o %, con vista previa en vivo y CSS copiable. Generar Generador de Sombra de Texto CSS Diseña un text-shadow con desplazamientos, desenfoque, color y opacidad — vista previa en vivo sobre texto de muestra. Generar