Escala de grises
100%
Pila de filtros
filter: grayscale(100%);
Herramientas de diseño
Generador de filtros CSS — Efectos de imagen en vivo
Combina desenfoque, escala de grises, contraste y funciones de filtro CSS relacionadas con vista previa en vivo. Arrastra los deslizadores para crear pilas como filter: blur(2px) grayscale(100%); y copia el resultado.
DiseñoCSSFiltro
Añadir esta herramienta a favoritos
No se ha seleccionado un modo de almacenamiento de favoritos.
Acciones rápidas
Copia la URL de esta herramienta o abre la hoja de compartir del sistema en un dispositivo compatible.
设计配色
Generador de filtros CSS
CSS Filter Rule
filter: none;
等待调整滤镜。
Casos de uso
- Probar valores de filtro en escala de grises o atenuados para iconos del sitio o tarjetas de producto
Cómo usar
- Arrastra los deslizadores de filtro y luego copia el CSS del panel de salida a tu hoja de estilos
Entrada y salida de ejemplo
FAQ
¿La compatibilidad con navegadores es limitada?
El filtro CSS es ampliamente compatible con navegadores modernos de escritorio y móviles.
Herramientas
Herramientas relacionadas
Continúa con otra herramienta traducida para una tarea cercana.
Inversor de color
Inversor de color — Inversión RGB y vista previa en oscuro
Invierte un color restando cada canal RGB de 255. Compara los colores de origen e invertido, previsualiza capas de muestra y exporta un fragmento de variable CSS para exploración de temas oscuros.
Color Invertir Oscuro
Generador de colores pastel
Generador de colores pastel — Paletas suaves de baja saturación
Genera paletas pastel suaves y de estilo Morandi en tu navegador. Elige la cantidad y el estilo, bloquea las muestras que quieras conservar y exporta listas HEX o variables CSS para gráficos, fondos y temas de interfaz suaves.
Pastel Paleta Color