Rail Signature

Documentación técnica oficial para la integración de la firma dinámica en proyectos de la empresa.

Demo en tiempo real

Mira hacia la esquina inferior derecha de la pantalla

Integration HTML / JS

Uso básico para landings o sitios estáticos.

<!-- 1. Cargar el script antes del final del body --> <script src="path/to/preview.js"></script> <!-- 2. Inicializar con tus variables --> <script> window.onload = () => { initRailSignature({ theme: 'light', railColor: '#00bf63' }); }; </script>

Integration React / Next.js

Componente optimizado para SPAs.

import { useEffect } from 'react'; const RailSignature = () => { useEffect(() => { if (window.initRailSignature) { window.initRailSignature({ railColor: '#00bf63', theme: 'dark' }); } }, []); return null; // Se inyecta al DOM };

Integration Laravel / Blade

Integración en layouts dinámicos.

{{-- En tu layout.blade.php --}} @push('scripts') <script src="{{ asset('js/preview.js') }}"></script> <script> initRailSignature({ theme: '{{ $userTheme ?? "light" }}', railColor: '#00bf63' }); </script> @endpush

Configuración de Variables

Propiedad Tipo Descripción
theme String Estilo visual: 'light' o 'dark'.
railColor Hex Color principal de la marca y bordes animados.
typingSpeed Number Velocidad de escritura en ms (def: 38).
position String Ubicación: 'bottom-right' o 'bottom-left'.