Generador de fondos de rayas CSS
Ajusta ángulo, colores y grosor para crear fondos rayados en CSS y copiar el código
Esta herramienta usa repeating-linear-gradient para crear en tiempo real fondos de rayas: diagonales, pinstripe, patrones de advertencia y mucho más. Va bien para diseñadores y desarrolladores que necesitan código CSS rápido para banners, fondos de sección o elementos decorativos. Todo se genera en tu navegador, sin enviar nada a un servidor.
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Cómo usar
- Haz clic en uno de los ajustes predefinidos (diagonal, pinstripe, advertencia, candy cane, pastel, etc.) para empezar
- Afina el patrón con el control de ángulo y los controles de grosor de cada color
- Elige los dos colores con el selector o escribiendo su valor HEX
- Revisa la vista previa y copia el código CSS generado para pegarlo en tu proyecto
Preguntas frecuentes
- ¿En qué propiedad se usa el CSS generado?
- Pégalo tal cual como valor de la propiedad background-image. El patrón se aplica con CSS puro, sin necesidad de ningún archivo de imagen.
- ¿Puedo guardarlo como archivo de imagen?
- Esta herramienta solo genera código CSS. Está pensada para cuando prefieres aplicar el fondo mediante código en lugar de una imagen.
- ¿Se ve bien en todos los navegadores?
- repeating-linear-gradient es una función estándar de CSS con soporte muy amplio en los navegadores actuales.