Generador de Filtros CSS
Una herramienta visual para generar y previsualizar propiedades de filtro CSS.
Configuración de Filtros
Ajusta cada propiedad de filtro
Preajustes
Prueba estilos de filtro predefinidos
Vista Previa
Ver los efectos de filtro generados en la imagen predeterminada
Original
Filtrado
Filter Preview
CSS Generado
filter: none;Funciones de Filtro CSS Explicadas
Efectos Visuales
- • blur(px): Efecto de desenfoque
- • brightness(%): Ajuste de brillo
- • contrast(%): Ajuste de contraste
- • opacity(%): Ajuste de opacidad
Efectos de Color
- • grayscale(%): Efecto de escala de grises
- • hue-rotate(deg): Rotación de tono
- • invert(%): Inversión de color
- • saturate(%): Ajuste de saturación
- • sepia(%): Efecto sepia
Consejos de Uso
- • Combina múltiples filtros separados por espacios
- • Aplica a cualquier elemento HTML, no solo a imágenes
- • Usa con animaciones CSS para efectos dinámicos
- • Usa backdrop-filter para aplicar solo a fondos