WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
El susurrador de códigos
652
byby.createsite
Abrir en el editor
Publica tu código
Recomendado
14 June 2025
Un código de Metehan
9 September 2024
Generador de códigos QR en JavaScript
10 May 2025
Un código de Mete
HTML
Copy
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: #000; display: flex; align-items: center; justify-content: center; height: 100vh; overflow: hidden; } .codigo { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #272822; color: #F8F8F2; font-family: 'Consolas', 'Monaco', monospace; font-size: 18px; padding: 20px; border-radius: 8px; white-space: pre-line; text-align: left; line-height: 1.6; max-height: 50%; width: 100%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } .selector { color: #F92672; } .property { color: #66D9EF; } .value-number { color: #AE81FF; } .value-string { color: #E6DB74; } .value-color { color: #A6E22E; } .brace { color: #F8F8F2; } .comment { color: #75715E; } .function { color: #A6E22E; } .animation-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; width: 100%; height: 50%; overflow: hidden; background-color: #000; } .code-element { position: absolute; width: 20px; height: 20px; opacity: 0; animation: codeDance 3s infinite alternate; } @keyframes codeDance { 0% { opacity: 0; transform: scale(0.5); } 50% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.2); } } .code-element:nth-child(1) { background: #F8F8F2; animation-delay: 0s; } /* Light gray background for the first element */ .code-element:nth-child(2) { background: #66D9EF; animation-delay: 0.2s; } .code-element:nth-child(3) { background: #AE81FF; animation-delay: 0.4s; } .code-element:nth-child(4) { background: #F92672; animation-delay: 0.6s; } /* ... more elements, varying colors and animation delays ... */
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */