Created
July 21, 2026 11:59
-
-
Save markolofsen/5cd8e3996b963d18ce7a45d92a51afca to your computer and use it in GitHub Desktop.
Hello World page
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>Hello World</title> | |
| <style> | |
| * { margin: 0; padding: 0; box-sizing: border-box; } | |
| body { | |
| min-height: 100vh; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); | |
| font-family: 'Segoe UI', system-ui, sans-serif; | |
| } | |
| .card { | |
| text-align: center; | |
| padding: 3rem 4rem; | |
| background: rgba(255, 255, 255, 0.05); | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| border-radius: 1.5rem; | |
| backdrop-filter: blur(10px); | |
| box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4); | |
| } | |
| h1 { | |
| font-size: 4rem; | |
| font-weight: 700; | |
| background: linear-gradient(90deg, #e94560, #0f3460, #533483); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| background-clip: text; | |
| margin-bottom: 1rem; | |
| } | |
| p { | |
| color: rgba(255, 255, 255, 0.6); | |
| font-size: 1.1rem; | |
| letter-spacing: 0.05em; | |
| } | |
| .dot { | |
| display: inline-block; | |
| width: 8px; | |
| height: 8px; | |
| background: #e94560; | |
| border-radius: 50%; | |
| margin: 1.5rem auto 0; | |
| animation: pulse 1.5s ease-in-out infinite; | |
| } | |
| @keyframes pulse { | |
| 0%, 100% { transform: scale(1); opacity: 1; } | |
| 50% { transform: scale(1.5); opacity: 0.5; } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="card"> | |
| <h1>Hello, World!</h1> | |
| <p>Your page is live and running ✨</p> | |
| <div class="dot"></div> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment