Generador de filtros CSS
Ajusta blur, brillo, contraste, saturación y más con controles deslizantes y genera el código CSS filter al instante
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Una herramienta para ajustar con controles deslizantes blur, brightness, contrast, grayscale, hue-rotate, saturate y sepia, y comprobar el resultado en una vista previa en tiempo real. Resulta práctica para maquetadores y diseñadores web que quieren ajustar visualmente los valores de filter de imágenes o cajas y copiar el código para usarlo enseguida.
Cómo usar
- Mueve los controles deslizantes para ajustar el efecto de filtro que quieras.
- Comprueba el resultado en tiempo real en el recuadro de vista previa de arriba.
- Copia el CSS de filter ya listo y pégalo en el elemento que quieras.
- Si no te convence, vuelve a los valores predeterminados con el botón de restablecer.
Preguntas frecuentes
- ¿Se incluyen en el CSS los controles deslizantes que están en su valor predeterminado?
- No. Los filtros con el valor predeterminado (100 %) en brillo, contraste o saturación, o con blur en 0, se omiten automáticamente del código resultante, de modo que solo se generan los valores realmente necesarios.
- ¿Se envía a un servidor el valor que introduzco?
- No se envía. Todos los cálculos y la vista previa se procesan únicamente en tu navegador; no se envía ningún dato a ningún servidor.
- ¿Puedo combinar varios filtros a la vez?
- Sí. Si ajustas varios controles deslizantes a la vez, se combinan en un único valor de filter unido por espacios, como blur(2px) brightness(110%).