Generador de textura granulada (noise) para fondos
Ajusta el grano y míralo sobre el fondo. El SVG usa el filtro feTurbulence y pesa pocos bytes; el PNG es un bloque pequeño que se repite sin costura aparente.
Cómo usarGrano de película para fondos
Disponible en: 
Generador de textura granulada (noise) para fondos: para qué sirve
Una capa ligera de grano deja los fondos lisos y los degradados con aspecto de papel o de película y además disimula las franjas que aparecen en degradados suaves.
Ajusta el tamaño del grano, el detalle, la opacidad y el modo de mezcla, y mira el resultado sobre un degradado de prueba. Copia el CSS con el ruido en SVG (filtro feTurbulence, con pocos bytes y sin costuras) aplicado en un pseudoelemento, o descarga un PNG de 128, 256 o 512 px para repetir en el fondo.
Cómo usar
- Ajusta el grano, la opacidad y la mezcla.
- Pruébalo sobre los colores de tu fondo.
- Copia el CSS o descarga el PNG.
Cuándo usar
- Fondo de hero con degradado.
- Tarjetas con textura de papel.
- Visual retro o de película.
Preguntas frecuentes
¿Para qué sirve el grano?
Una capa ligera de ruido quita el aspecto plástico de los fondos lisos y degradados, vuelve el visual más orgánico y además disimula las franjas que aparecen en degradados suaves (banding).
¿SVG o PNG?
El SVG con feTurbulence pesa pocos bytes y escala a cualquier tamaño, pero lo dibuja el navegador y puede ser pesado en pantallas grandes con animaciones. El PNG es un bloque pequeño repetido, liviano de dibujar. Para un fondo fijo, los dos funcionan bien.
¿Cuánto grano usar?
Poco. Una opacidad entre 5% y 15% ya da textura sin ensuciar la página; por encima de eso el fondo empieza a parecer una foto con ruido y dificulta la lectura del texto encima.
¿Es gratis de verdad?
Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas.