WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
O sussurrador de códigos
642
byby.createsite
Abrir no Editor
Publique Seu Código
Recomendado
13 June 2025
ilusão de profundidade
10 June 2025
Um código de Mete
11 June 2025
Um 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) */